main.drill{display:grid;grid-template-columns:280px 1fr;gap:18px;align-items:start}
.lessons{padding:14px;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto}
.lessons h3{margin:8px 0 6px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.lessons button{display:flex;width:100%;text-align:left;gap:8px;align-items:center;background:none;border:0;color:var(--ink2);font:14px var(--body);padding:7px 8px;border-radius:9px;cursor:pointer}
.lessons button:hover{background:var(--panel2);color:var(--ink)}
.lessons button.on{background:var(--gold);color:#0a0e1a;font-weight:700}
.lessons button .n{font-family:var(--mono);font-size:11px;color:inherit;opacity:.7;width:46px;flex:none}
.lessons button .ok{margin-left:auto;color:var(--green)}
.lessons button.on .ok{color:#06281c}
.tabs{display:flex;gap:6px;margin:0 0 16px;border-bottom:1px solid var(--line2)}
.tabs button{background:none;border:0;border-bottom:3px solid transparent;color:var(--ink2);font:700 14px var(--body);padding:10px 14px;cursor:pointer}
.tabs button.on{color:var(--gold);border-color:var(--gold)}
.q{font-size:19px;line-height:1.45;margin:6px 0 16px}
.choices{display:grid;gap:10px}
.choice{display:flex;gap:12px;align-items:center;text-align:left;background:#0c1124;border:1px solid var(--line2);border-radius:12px;padding:12px 14px;color:var(--ink);font:17px var(--body);cursor:pointer}
.choice:hover{border-color:var(--gold)}
.choice .l{width:28px;height:28px;border-radius:50%;border:1px solid var(--line2);display:grid;place-items:center;font:700 13px var(--mono);flex:none;color:var(--ink2)}
.choice.right{border-color:var(--green);background:rgba(58,210,159,.12)}
.choice.wrong{border-color:var(--scarlet);background:rgba(210,31,51,.12)}
.choice:disabled{cursor:default}
.expl{margin-top:14px;padding:14px;border-radius:12px;background:var(--panel2);border:1px solid var(--line)}
.expl b{color:var(--gold)}
.bar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--ink3);margin-bottom:10px}
.bar b{color:var(--gold);font-family:var(--mono)}
.learn h2{margin:0 0 4px}.learn h3{color:var(--gold);font-size:14px;letter-spacing:.1em;text-transform:uppercase;margin:22px 0 8px}
.learn ul{margin:0;padding-left:20px;color:var(--ink2)}.learn li{margin:4px 0}
.learn p{color:var(--ink2);margin:8px 0}
.ex{background:#0c1124;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:8px 0}
.ex .p{color:var(--ink);font-weight:700}.ex ol{margin:6px 0 0;padding-left:20px;color:var(--ink2)}
.trap{border-left:3px solid var(--scarlet);padding:6px 12px;margin:6px 0;color:var(--ink2)}
.progress{height:8px;background:var(--line);border-radius:999px;overflow:hidden;margin:8px 0 16px}
.progress div{height:100%;background:var(--gold)}
@media (max-width:860px){main.drill{grid-template-columns:1fr}.lessons{position:static;max-height:none}}
.timer{font:700 22px var(--mono);color:var(--gold);min-width:70px;text-align:right}
.timer.low{color:var(--scarlet2)}
.sec{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.sec:last-child{border-bottom:none}.sec b{display:block}.sec small{color:var(--ink3)}.sec .act{margin-left:auto}
.range{display:grid;grid-template-columns:150px 1fr 80px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.range:last-child{border-bottom:none}
.range .track{position:relative;height:14px;background:var(--line);border-radius:999px}
.range .band{position:absolute;top:0;bottom:0;background:var(--gold);border-radius:999px;opacity:.9}
.range .mid{position:absolute;top:-4px;width:2px;height:22px;background:#fff}
.range .v{font-family:var(--mono);color:var(--gold);text-align:right}
.review .ex{border-left:3px solid var(--line2)}.review .ex.ok{border-left-color:var(--green)}.review .ex.no{border-left-color:var(--scarlet)}

.passage{background:#0c1124;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:12px;padding:14px 16px;margin:6px 0 14px;color:var(--ink2);line-height:1.6;font-size:16px;white-space:pre-line}
