.practice-shell{max-width:760px;margin:18px auto}.practice-top{display:flex;justify-content:space-between;align-items:center}.practice-top>span{font-weight:900;color:#16845a}.progress{height:10px;background:#dfe9e2;border-radius:999px;overflow:hidden;margin:12px 0 20px}.progress i{display:block;height:100%;background:#21a36f;border-radius:inherit}.practice-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:16px}.practice-steps span{padding:8px 5px;border-radius:10px;text-align:center;background:#e8efea;color:#748079;font-size:11px;font-weight:800}.practice-steps span.active{background:#153d30;color:#fff}.practice-steps span.done{background:#daf6e7;color:#087047}.focus-word{text-align:center;min-height:390px;display:flex;flex-direction:column;justify-content:center;align-items:center}.focus-word h2{font-size:clamp(32px,7vw,58px);margin:12px}.focus-word .meaning{font-size:22px;max-width:620px}.focus-word form{width:min(420px,100%)}.focus-word input{text-align:center;font-size:22px}.listen-symbol{font-size:60px}.example-box{background:#edf5ef;border-radius:18px;padding:20px;width:100%;margin:12px 0 22px}.example-box p{font-size:24px;margin:8px}.example-box small{color:#69756f}.practice-lock{text-align:center;color:#69756f;font-size:12px}.route-finished{max-width:650px;text-align:center;margin:40px auto}.route-finished button{margin:5px}.finish-mark{display:grid;place-items:center;width:72px;height:72px;margin:auto;border-radius:50%;background:#daf6e7;color:#087047;font-size:38px;font-weight:900}@media(max-width:600px){.practice-steps{grid-template-columns:repeat(5,100px);overflow-x:auto}.focus-word{min-height:350px;padding:20px}}
