.eg-shell{max-width:960px}.eg-top{display:flex;justify-content:space-between;gap:12px;margin-bottom:16px}.eg-top a{font-weight:900;text-decoration:none}.eg-lead{color:#64748b}.eg-filters{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:8px;margin:20px 0}.eg-filters select,.eg-filters button{min-height:44px;border:1px solid #d7dee8;border-radius:11px;background:#fff;padding:8px 10px;font:inherit}.eg-filters button{font-weight:900;cursor:pointer}.eg-stage-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.eg-stage-grid a{display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid #dfe6ee;border-radius:16px;background:#fff;text-decoration:none;color:#1f2937}.eg-stage-grid strong{font-size:18px}.eg-stage-grid small,.eg-stage-grid span{color:#64748b}.eg-gauge{padding:14px 16px;margin-bottom:18px;border:1px solid #dfe6ee;border-radius:15px;background:#fff}.eg-gauge>div:first-child{display:flex;justify-content:space-between}.eg-bar{height:10px;margin-top:8px;background:#e9eef4;border-radius:99px;overflow:hidden}.eg-bar i{display:block;height:100%;background:#2d9d78;transition:.25s}.eg-step{position:relative;margin-bottom:14px}.eg-num{display:inline-flex;width:30px;height:30px;border-radius:50%;align-items:center;justify-content:center;background:#eef4ff;font-weight:1000}.eg-step h2{display:inline-block;margin:0 0 14px 8px}.eg-step p{line-height:1.9}.eg-rule,.eg-note{padding:12px 14px;margin:10px 0;border-radius:12px;background:#f5f8fb}.eg-rule b,.eg-note b{display:block;margin-bottom:4px}.eg-example{padding:12px 0;border-bottom:1px solid #edf0f4}.eg-example strong,.eg-example span,.eg-example small{display:block}.eg-example strong{font-size:19px}.eg-example span{margin-top:4px}.eg-example small{margin-top:5px;color:#64748b}.eg-section{margin-top:14px;border:0;cursor:pointer}.eg-q{padding:14px 0;border-top:1px solid #edf0f4}.eg-q:first-child{border-top:0}.eg-question{font-size:20px;font-weight:900;line-height:1.6}.eg-choices{display:grid;gap:8px;margin-top:12px}.eg-choices button,.eg-token,.eg-check{min-height:46px;border:1px solid #d6dee8;border-radius:11px;background:#fff;font:inherit;font-weight:800;cursor:pointer}.eg-choices button{padding:9px 12px;text-align:left}.eg-feedback{min-height:26px;margin-top:8px;font-weight:900}.eg-feedback.ok{color:#168052}.eg-feedback.ng{color:#b33e3e}.eg-tokenbox,.eg-answerbox{display:flex;flex-wrap:wrap;gap:7px;min-height:54px;padding:9px;margin-top:9px;border:1px dashed #cbd5e1;border-radius:12px}.eg-token{padding:7px 11px}.eg-check{margin-top:8px;padding:8px 16px}.eg-finish{text-align:center;padding:24px;margin:20px 0;border:2px solid #2d9d78;border-radius:18px;background:#f0fbf7}.eg-finish button{border:0;cursor:pointer}.is-done{opacity:.72}.is-done .eg-section{display:none}@media(max-width:720px){.eg-filters{grid-template-columns:1fr 1fr}.eg-filters button{grid-column:1/-1}.eg-stage-grid{grid-template-columns:1fr}.eg-shell{padding-left:14px;padding-right:14px}.eg-question{font-size:18px}}
.eg-locked{display:none}

/* v004: one learning screen at a time */
.eg-screen[hidden]{display:none!important}.eg-step-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 0 14px}.eg-step-nav span{padding:9px 5px;border-radius:10px;background:#eef2f6;text-align:center;font-size:13px;font-weight:900;color:#64748b}.eg-step-nav span.is-current{background:#e7f5ef;color:#167254}.eg-step-nav span.is-done:before{content:'✓ ';}.eg-screen{margin-bottom:18px}.eg-screen-actions{display:grid;gap:10px;margin-top:22px}.eg-big-action{width:100%;min-height:58px;padding:14px 18px;border:0;border-radius:15px;background:#1f8f68;color:#fff;font:inherit;font-size:17px;font-weight:1000;cursor:pointer;display:flex;align-items:center;justify-content:space-between}.eg-big-action span{font-size:22px}.eg-secondary-action{width:100%;min-height:50px;padding:11px 16px;border:1px solid #cbd5e1;border-radius:13px;background:#fff;color:#334155;font:inherit;font-weight:900;cursor:pointer}.eg-reference-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:2px 0 18px}.eg-reference-actions button{min-height:50px;padding:10px 12px;border:1px solid #cbd5e1;border-radius:13px;background:#f8fafc;font:inherit;font-weight:900;cursor:pointer}.eg-choices button{min-height:54px;padding:12px 15px;font-size:17px}.eg-check{width:100%;min-height:54px;margin-top:12px;background:#1f8f68;color:#fff;border:0}.eg-token{min-height:48px}.eg-part-clear{padding:22px 14px;text-align:center;font-size:19px;font-weight:1000}.eg-finish .primary-link{display:block;width:100%;min-height:56px;font-size:17px;font-weight:1000}@media(max-width:520px){.eg-step-nav{gap:4px}.eg-step-nav span{font-size:11px;padding:8px 2px}.eg-reference-actions{grid-template-columns:1fr 1fr}.eg-big-action{min-height:60px}}

/* v005 */
.eg-hero{display:flex;align-items:center;gap:22px;padding:26px 28px;margin-bottom:16px;border:1px solid #dce6ee;border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f4faf7 100%);box-shadow:0 10px 30px rgba(15,23,42,.06)}
.eg-hero-mark{flex:0 0 88px;width:88px;height:88px;border-radius:24px;display:flex;align-items:center;justify-content:center;background:#1f8f68;color:#fff;font-size:26px;font-weight:1000;letter-spacing:-2px;box-shadow:0 8px 20px rgba(31,143,104,.2)}.eg-hero-mark span{margin:0 4px;font-size:17px}.eg-eyebrow{margin:0 0 3px;color:#1f8f68;font-size:12px;font-weight:1000;letter-spacing:.12em}.eg-hero h1{margin:0;font-size:34px}.eg-hero .eg-lead{margin:7px 0 0;font-size:15px}.eg-flow{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:13px}.eg-flow span{padding:5px 9px;border-radius:999px;background:#fff;border:1px solid #dce6ee;font-size:12px;font-weight:900}.eg-flow i{font-style:normal;color:#94a3b8}.eg-start-actions{display:grid;gap:10px;margin:16px 0 22px}.eg-main-action{display:grid;gap:4px;padding:20px 22px;border-radius:20px;background:#1f8f68;color:#fff;text-decoration:none;box-shadow:0 8px 20px rgba(31,143,104,.16)}.eg-main-action small{font-weight:900;opacity:.85}.eg-main-action strong{font-size:20px}.eg-main-action span{font-size:14px;font-weight:900}.eg-sub-action{padding:12px;text-align:center;border:1px solid #dce6ee;border-radius:14px;background:#fff;text-decoration:none;font-weight:900}.eg-picker{padding:20px;border:1px solid #dfe6ee;border-radius:22px;background:#fff}.eg-picker-head h2{margin:0}.eg-picker-head p{margin:5px 0 15px;color:#64748b}.eg-grade-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:3px}.eg-grade-tabs a{flex:0 0 auto;min-width:70px;padding:11px 14px;border:1px solid #d6dee8;border-radius:999px;background:#f8fafc;text-align:center;text-decoration:none;color:#334155;font-weight:900}.eg-grade-tabs a.is-active{background:#1f8f68;border-color:#1f8f68;color:#fff}.eg-picker-empty{padding:30px 12px;text-align:center;color:#64748b}.eg-result-head{display:flex;justify-content:space-between;align-items:center;margin:18px 0 10px}.eg-stage-no{font-weight:900;color:#1f8f68!important}
.eg-reference-actions{margin:22px 0 0}.eg-answerbox{display:none}.eg-slots{display:flex;align-items:flex-end;flex-wrap:wrap;gap:8px;min-height:66px;padding:14px 10px;margin-top:14px;border-radius:14px;background:#f8fafc}.eg-slot{min-width:64px;min-height:44px;padding:6px 8px;border:0;border-bottom:3px solid #94a3b8;background:transparent;font:inherit;font-weight:900;color:#172033;cursor:pointer}.eg-slot:disabled{cursor:default}.eg-slot span{color:#94a3b8}.eg-slot.is-filled{border-bottom-color:#1f8f68}.eg-punct{padding:0 2px 7px 0;font-size:24px;font-weight:1000}.eg-tokenbox{border:0;background:#fff;padding:14px 0;justify-content:center}.eg-token{min-height:50px;padding:9px 14px;border:1px solid #cbd5e1;border-radius:13px;background:#fff;box-shadow:0 2px 5px rgba(15,23,42,.05)}.eg-slots.is-wrong{animation:egShake .34s linear}.eg-feedback.ng{color:#b33e3e;text-align:center}.eg-feedback.ok{text-align:center}@keyframes egShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-6px)}80%{transform:translateX(6px)}}
@media(max-width:620px){.eg-hero{padding:20px 17px;gap:14px;border-radius:20px}.eg-hero-mark{width:64px;height:64px;flex-basis:64px;border-radius:18px;font-size:20px}.eg-hero h1{font-size:28px}.eg-flow{display:none}.eg-picker{padding:16px}.eg-main-action{padding:18px}.eg-slot{min-width:52px}.eg-reference-actions{grid-template-columns:1fr 1fr}}

.eg-ja{font-size:1rem;font-weight:700;line-height:1.65;margin:0 0 12px;padding:10px 12px;background:#f7f8fb;border-radius:12px}
.eg-feedback.is-pop{animation:eg-correct-pop .42s ease-out}
@keyframes eg-correct-pop{0%{transform:scale(.75);opacity:.2}55%{transform:scale(1.18)}100%{transform:scale(1);opacity:1}}
.eg-q.is-wrong,.eg-slots.is-wrong{animation:calc-answer-shake .18s ease-in-out 1}
@keyframes calc-answer-shake{0%,100%{transform:translateX(0)}30%{transform:translateX(-7px)}65%{transform:translateX(7px)}}


/* v008: correct answer full-screen cut-in */
.eg-correct-overlay{position:fixed;inset:0;z-index:2100;display:grid;place-items:center;background:transparent;pointer-events:none;opacity:0;transition:opacity .12s ease-out}
.eg-correct-overlay.show{opacity:1}
.eg-correct-overlay.hide{opacity:0;transition:opacity .16s ease-in}
.eg-correct-text{font-size:clamp(64px,15vw,150px);line-height:1;font-weight:1000;letter-spacing:.04em;color:#168052;text-align:center;text-shadow:0 5px 18px rgba(255,255,255,.98),0 2px 8px rgba(22,128,82,.22);transform:scale(.45);opacity:0}
.eg-correct-overlay.show .eg-correct-text{animation:eg-correct-overlay-pop .72s cubic-bezier(.18,.86,.24,1.12) both}
@keyframes eg-correct-overlay-pop{0%{transform:scale(.45);opacity:0}42%{transform:scale(1.14);opacity:1}68%{transform:scale(.98);opacity:1}100%{transform:scale(1);opacity:1}}