body{margin:0;font-family:Arial,sans-serif;background:#f5f7fb;color:#18233a}header{padding:18px 5%;font-size:22px;font-weight:700;background:white;box-shadow:0 2px 8px #ddd}main{max-width:900px;margin:35px auto;padding:0 18px}.card{background:white;padding:28px;border-radius:18px;margin:20px 0;box-shadow:0 5px 20px #dfe4ee}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.lesson{background:white;padding:25px;border-radius:15px;text-decoration:none;color:inherit;box-shadow:0 3px 12px #ddd}.lesson span{display:block;margin-top:12px;color:#667}input,button{box-sizing:border-box;width:100%;padding:14px;margin:8px 0;border-radius:10px;border:1px solid #ccd2df;font-size:16px}button{font-weight:bold;cursor:pointer}.top{display:flex;justify-content:space-between;align-items:center}.correct{padding:15px;margin-top:15px;background:#e8f7ed;border-radius:10px}.wrong,.msg{padding:15px;margin-top:15px;background:#fff0e8;border-radius:10px}.bar{display:flex;margin:20px 0}.bar div{flex:1;border:2px solid #333;padding:15px;text-align:center}.small{font-size:12px;color:#667}table{width:100%;border-collapse:collapse}td,th{padding:10px;border-bottom:1px solid #ddd;text-align:left}@media(max-width:600px){.top{display:block}}