*{box-sizing:border-box} :root{color-scheme:dark;--bg:#101827;--panel:#1b2738;--text:#edf2f8;--muted:#a8b5c7;--accent:#65b5ff;--ok:#63d6a1;--bad:#ff7c83}body{margin:0;background:var(--bg);color:var(--text);font:17px/1.5 system-ui,sans-serif}header{display:flex;justify-content:space-between;align-items:center;padding:14px max(16px,calc((100vw - 760px)/2));border-bottom:1px solid #344256;position:sticky;top:0;background:#101827}header a{font-weight:700;color:var(--text);text-decoration:none}main{max-width:760px;margin:auto;padding:20px 16px 60px}.card{background:var(--panel);padding:18px;border-radius:16px;margin:12px 0}h1{font-size:1.55rem;margin:.4em 0}h2{font-size:1.2rem}button,input,select{font:inherit}button{border:0;border-radius:12px;background:var(--accent);color:#081321;padding:13px 18px;min-height:48px;font-weight:700;cursor:pointer}button.secondary{background:#35465d;color:var(--text)}button.quiet{background:transparent;color:var(--muted);padding:8px}button:disabled{opacity:.55}input[type=password],input[type=number],select{width:100%;border:1px solid #46556a;background:#101827;color:var(--text);padding:13px;border-radius:10px;margin:6px 0 14px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.row>*{flex:1}.lesson{display:flex;gap:12px;align-items:center}.lesson label{display:flex;gap:12px;align-items:center;flex:1}.lesson input{width:22px;height:22px}.progress{height:8px;background:#364459;border-radius:8px;overflow:hidden}.progress span{display:block;height:100%;background:var(--ok)}.option{display:block;width:100%;text-align:left;margin:9px 0;background:#2a3a50;color:var(--text);min-height:56px}.option.selected{outline:2px solid var(--accent)}.option.right{background:#164b3a}.option.wrong{background:#62333b}.code{white-space:pre;overflow-x:auto;background:#0a111b;padding:14px;border-radius:10px}.markdown{overflow-wrap:anywhere}.feedback{padding:14px;border-radius:12px}.good{color:var(--ok)}.bad{color:var(--bad)}.muted{color:var(--muted)}.hidden{display:none!important}details{margin:12px 0}.pill{background:#35465d;padding:4px 9px;border-radius:20px;font-size:.85rem}.error{color:var(--bad);padding:10px 0}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}progress{width:100%;height:10px}pre{overflow-x:auto}@media(min-width:600px){main{padding-top:30px}.card{padding:24px}}