/* 중학 수학 — 계단 점 · 문제 칸 · 불 (2026-10-06). kids.css · middle.css 위에 얹는다. */

/* 단원 제목 아래 불 — 판마다 하나 */
.m-lamps{display:flex;align-items:center;gap:8px;margin:14px 0 0;font-family:var(--mono);font-size:12px;color:var(--chalk-dim)}
.m-lamps i{width:14px;height:14px;border-radius:50%;border:2px solid var(--brass);display:inline-block;transition:background .4s,box-shadow .4s}
.m-lamps i.half{background:linear-gradient(90deg,var(--brass) 50%,transparent 50%)}
.m-lamps i.on{background:var(--brass);box-shadow:0 0 10px var(--brass-soft)}
.m-lamps span{margin-left:4px;letter-spacing:.04em}

/* 판 머리의 계단 점 — 누르면 지나온 계단으로 돌아간다 */
.m-steps{display:flex;align-items:center;gap:7px;margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--chalk-dim)}
.m-steps button{width:16px;height:16px;padding:0;border-radius:50%;border:2px solid var(--brass);background:transparent;cursor:pointer;transition:background .3s,box-shadow .3s}
.m-steps button.done{background:var(--brass)}
.m-steps button.now{box-shadow:0 0 0 4px rgba(201,162,39,.28)}
.m-steps button:disabled{opacity:.35;cursor:default}
.m-steps span{margin-left:4px;white-space:nowrap}
.k-board-h{flex-wrap:wrap;row-gap:8px}

/* 문제 칸 */
.m-quiz{margin:0 0 72px;border:1px solid var(--ink-3);border-radius:18px;padding:22px 22px 18px;background:var(--ink-2)}
.m-quiz h2{margin:0 0 6px}
.m-quiz .k-q{margin:0 0 16px}
.m-q{font-size:21px;line-height:1.6;margin:0 0 14px}
.m-q b{font-family:var(--mono);font-weight:500;color:var(--brass-soft)}
.m-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.m-choices button{font:inherit;font-family:var(--mono);font-size:19px;padding:14px 10px;border-radius:12px;border:1.5px solid var(--ink-3);background:var(--ink);color:var(--chalk);cursor:pointer;transition:border-color .2s,background .2s}
.m-choices button:hover:not(:disabled){border-color:var(--brass)}
.m-choices button.ok{border-color:#3C9B6A;background:rgba(60,155,106,.16)}
.m-choices button.no{border-color:#C0574E;background:rgba(192,87,78,.14)}
.m-choices button:disabled{cursor:default}
.m-fb{min-height:1.6em;margin:14px 0 4px;line-height:1.7}
.m-fb.ok{color:#3C9B6A}.m-fb.no{color:#C0574E}
.m-fb .m-next{margin-top:10px;font:inherit;font-size:15px;padding:9px 18px;border-radius:999px;border:1.5px solid var(--brass);background:transparent;color:var(--brass);cursor:pointer}
.m-fb .m-next:hover{background:var(--brass);color:#141005}
.m-streak{display:flex;align-items:center;gap:8px;margin-top:12px;font-family:var(--mono);font-size:12px;color:var(--chalk-dim)}
.m-streak i{width:13px;height:13px;border-radius:50%;border:2px solid var(--brass);display:inline-block}
.m-streak i.on{background:var(--brass);box-shadow:0 0 8px var(--brass-soft)}
@media (max-width:520px){.m-choices button{font-size:17px;padding:12px 6px}.m-q{font-size:19px}}

/* 목차의 불 */
.m-units li a>span:last-child{font-family:var(--mono);font-size:12px;color:var(--brass)}
.m-units li.lit a>span:last-child::after{content:"●";font-size:15px;text-shadow:0 0 8px var(--brass-soft)}
.m-units li.half a>span:last-child::after{content:"◐";font-size:15px}