/* KishMat v58.50: immersive in-page stage, no dialog, shared puzzle Chessground board.
   All transitions use transform/opacity; chess board and piece themes come from site.css. */
.mastery-page .mastery-world-navigation{display:flex;gap:9px;overflow-x:auto;padding:3px 0 20px;scrollbar-width:thin;scroll-snap-type:x proximity}
.mastery-world-chip{scroll-snap-align:start;text-decoration:none!important;white-space:nowrap;display:inline-flex;align-items:center;gap:9px;padding:11px 17px;background:#fff;color:#537366;border:1px solid #d6e7dc;border-radius:15px;font-size:.88rem;font-weight:900;box-shadow:0 5px 14px #144f3611}
.mastery-world-chip span{width:24px;height:24px;border-radius:50%;background:#ebf1eb;display:grid;place-items:center}
.mastery-world-chip.is-active{background:#177c62;color:#fff;border-color:#177c62;box-shadow:0 5px 0 #0e624c}
.mastery-world-chip.is-won{border-color:#a9ddc7;color:#167d60}
.mastery-world-preview{padding-bottom:24px}
.mastery-world-preview .mastery-world-head{border:0;padding-bottom:0}
.mastery-world-preview:not(.mastery-world-conquered){filter:saturate(.72)}
.mastery-world-gate{background:linear-gradient(#ffffff77,#e3ede8aa);border:1px dashed #acbaaf;border-radius:20px;text-align:center;margin:20px auto 4px;padding:20px;max-width:490px}
.mastery-world-gate .mastery-gate-castle{display:block;font-size:3.3rem;opacity:.6;line-height:1.25}
.mastery-world-gate strong{display:block;font-size:1rem;color:#536e65}.mastery-world-gate p{font-size:.84rem;color:#66796e;margin:5px 0 0}
.mastery-conquered-review{margin:15px 0 0;background:#fff8;border-radius:16px;padding:12px 16px;color:#28715b;font-weight:800}
.mastery-conquered-review summary{cursor:pointer}.mastery-review-list{display:flex;flex-wrap:wrap;gap:10px;padding-top:13px;font-size:.81rem}.mastery-review-list span{background:#e8f6ed;border-radius:8px;padding:5px 10px}
.mastery-trail:before{content:'';position:absolute;top:35px;bottom:55px;left:50%;width:5px;border-radius:100px;background:repeating-linear-gradient(180deg,#b2d5be 0 20px,transparent 20px 34px);opacity:.65;pointer-events:none}
.mastery-world-current{box-shadow:0 18px 50px #1b64401c,0 0 0 3px #ffffff99 inset}
.mastery-world-current .mastery-node.is-current .mastery-node-symbol{animation:mastery-jump 2.6s ease-in-out infinite}
.mastery-world-current .mastery-node.is-ready .mastery-node-symbol:after{content:'✦';position:absolute;top:-17px;right:2px;color:#f0be40;text-shadow:0 1px #fff;animation:mastery-twinkle 1.5s ease-in-out infinite}
@keyframes mastery-jump{0%,100%{transform:translateY(0)}45%,55%{transform:translateY(-9px)}}
@keyframes mastery-twinkle{50%{transform:rotate(25deg) scale(1.25);opacity:.7}}

/* This screen replaces the path inside the current Razor page. It is not a modal. */
.mastery-lesson-screen[hidden],.mastery-shell .mastery-container[hidden],.mastery-lesson-screen [hidden]{display:none!important}
body.mastery-lesson-active,html:has(body.mastery-lesson-active){overflow:hidden!important;overscroll-behavior:none}
.mastery-lesson-screen{--lesson-text:#213e34;--lesson-muted:#568272;position:fixed;inset:0;z-index:2000;width:100%;height:100vh;height:100dvh;overflow:hidden;overscroll-behavior:contain;background:radial-gradient(ellipse at 90% 8%,#d7f8e0 0%,transparent 35%),linear-gradient(160deg,#f2fcf7,#e6f2f2);color:var(--lesson-text);isolation:isolate;animation:mastery-scene-enter .24s ease-out both}
@keyframes mastery-scene-enter{from{opacity:.15;transform:translateY(12px)}to{opacity:1;transform:none}}
.mastery-lesson-layout{height:100%;min-height:0;max-width:1320px;margin-inline:auto;padding:clamp(8px,1.4dvh,16px) clamp(10px,2vw,30px);display:flex;flex-direction:column;gap:clamp(5px,1.2dvh,12px);position:relative}
.mastery-lesson-header{display:flex;flex:0 0 auto;align-items:center;gap:clamp(8px,2vw,18px);min-height:50px}
.mastery-lesson-back{border:1px solid #c8e0d3;background:#fff;border-radius:13px;color:#426e5e;width:43px;height:43px;flex-shrink:0;font-weight:900;font-size:1.25rem;cursor:pointer;box-shadow:0 3px 0 #c9dfd2}
.mastery-lesson-back:hover,.mastery-lesson-action:hover{filter:brightness(.97)}
.mastery-lesson-heading{min-width:0;flex:1}.mastery-lesson-heading small{font-weight:900;font-size:.7rem;color:#22856d}.mastery-lesson-heading h2{font-size:clamp(1.05rem,2.5vw,1.65rem);margin:0;color:#1d5845;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:900}
.mastery-lesson-counter{text-align:left;min-width:84px;display:flex;flex-direction:column;align-items:flex-start;gap:0}.mastery-lesson-counter strong{font-size:1.16rem;color:#18775b;font-weight:900}.mastery-lesson-counter span{font-size:.67rem;color:var(--lesson-muted);font-weight:800}
.mastery-lesson-progress-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;min-height:20px}
.mastery-lesson-progress-row progress{flex:1;min-width:0;width:100%;height:10px;border:0;appearance:none;border-radius:99px;overflow:hidden;background:#d6e9dd;direction:ltr}
.mastery-lesson-progress-row progress::-webkit-progress-bar{background:#d6e9dd;border-radius:99px}
.mastery-lesson-progress-row progress::-webkit-progress-value{background:linear-gradient(90deg,#1bb68a,#84d96c);border-radius:99px;transition:width .2s ease}
.mastery-lesson-progress-row progress::-moz-progress-bar{background:#1bb68a}
.mastery-lesson-rating{justify-self:end;min-width:82px;text-align:center;font-size:.77rem;color:#427b67;font-weight:800;background:#fff9;border:1px solid #d1e3d8;border-radius:99px;padding:5px 12px;box-shadow:0 3px 10px #0f56320a}
.mastery-lesson-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(225px,.53fr);align-items:stretch;justify-items:center;flex:1 1 0;gap:clamp(8px,2vw,26px);min-height:0;min-width:0;overflow:hidden}
.mastery-lesson-board-column{width:100%;height:100%;min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;order:0}
.mastery-lesson-board-frame{--mastery-fit-board:460px;flex:0 0 auto;width:min(100%,var(--mastery-fit-board))!important;height:auto!important;aspect-ratio:1;position:relative;border:5px solid #fff!important;border-radius:14px!important;box-shadow:0 12px 30px #13584330,0 2px 0 #9cbea9!important;overflow:hidden;contain:layout paint;background:var(--board-dark)}
/* The very same Chessground DOM, CSS image pieces and coordinate settings as puzzles. */
#masteryMissionBoard{height:100%;width:100%;aspect-ratio:1;container-type:inline-size;border-radius:0}
#masteryMissionBoard.cg-wrap,#masteryMissionBoard cg-container,#masteryMissionBoard cg-board{width:100%!important;height:100%!important}
#masteryMissionBoard cg-board{border-radius:0}
.mastery-lesson-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#e9f5edec;z-index:3;color:#20765b;font-weight:800}
.mastery-lesson-spinner{width:31px;height:31px;border:4px solid #b8d5c6;border-top-color:#209b76;border-radius:50%;animation:mastery-spin .7s linear infinite}
@keyframes mastery-spin{to{transform:rotate(360deg)}}
.mastery-lesson-panel{justify-self:stretch;align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:clamp(10px,3dvh,26px);min-height:0;min-width:0;padding:clamp(12px,2.2vw,25px);background:#fff;border:1px solid #d6e9db;border-radius:22px;box-shadow:0 10px 30px #15543c14;order:1}
.mastery-lesson-kicker{color:#278869;font-size:.75rem;font-weight:900}.mastery-lesson-task h3{font-size:clamp(1.08rem,2vw,1.45rem);margin:8px 0;color:#255440;font-weight:900}.mastery-lesson-task p{font-size:clamp(.85rem,1.4vw,.97rem);line-height:1.8;color:#517166;min-height:3em;margin:0}
.mastery-lesson-task [data-state="error"]{color:#b33f45;font-weight:800}.mastery-lesson-task [data-state="success"]{color:#15825e;font-weight:900}
.mastery-lesson-actions{display:flex;gap:8px;flex-wrap:wrap}
.mastery-lesson-action{flex:1;min-width:118px;cursor:pointer;font:inherit;font-size:.84rem;font-weight:900;min-height:42px;padding:8px 12px;border:1px solid #bdd9c7;background:#edf7f0;color:#256c54;border-radius:12px;box-shadow:0 3px 0 #b8d2c2}
.mastery-lesson-action-primary{background:#178466;color:white;border-color:#0f785a;box-shadow:0 3px 0 #0e654e}
.mastery-lesson-meta{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:0 auto 10px}
.mastery-lesson-board-frame.is-wrong{animation:mastery-board-error .35s ease-out}.mastery-lesson-board-frame.is-correct{animation:mastery-board-success .55s ease-out}
@keyframes mastery-board-error{25%,75%{transform:translateX(-4px)}50%{transform:translateX(4px)}}
@keyframes mastery-board-success{50%{box-shadow:0 0 0 8px #38bf7d88,0 12px 30px #13584330}}
.mastery-lesson-finish{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(9px,2.5dvh,20px);text-align:center;padding:20px;background:radial-gradient(circle at 50% 25%,#fdf2c2,transparent 52%)}
.mastery-lesson-victory-icon{display:grid;place-items:center;font-size:clamp(4rem,15dvh,8.5rem);line-height:1;color:#d59c29;filter:drop-shadow(0 8px 2px #bd9d5a5e);animation:mastery-victory-rise .8s cubic-bezier(.2,1.3,.35,1) both}
.mastery-lesson-finish h2{font-size:clamp(1.5rem,5vw,2.7rem);color:#137255;margin:0}.mastery-lesson-finish p{font-size:clamp(.85rem,2vw,1rem);color:#4d7163;line-height:1.7;margin:0}.mastery-lesson-final-count{color:#248064}
.mastery-lesson-finish-actions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.mastery-lesson-sparkles{position:absolute;inset:0;pointer-events:none;z-index:-1;overflow:hidden;opacity:0}.mastery-lesson-sparkles i{position:absolute;left:calc(10% + var(--k) * 9%);top:-20px;width:11px;height:17px;background:#e5ac43;border-radius:3px;animation:mastery-spark-fall 2s ease-in both;animation-delay:calc(var(--k) * 80ms)}
.mastery-lesson-sparkles i:nth-child(1){--k:1}.mastery-lesson-sparkles i:nth-child(2){--k:2;background:#41bf8c}.mastery-lesson-sparkles i:nth-child(3){--k:3}.mastery-lesson-sparkles i:nth-child(4){--k:4;background:#af9dd8}.mastery-lesson-sparkles i:nth-child(5){--k:5}.mastery-lesson-sparkles i:nth-child(6){--k:6;background:#6ca7d7}.mastery-lesson-sparkles i:nth-child(7){--k:7}.mastery-lesson-sparkles i:nth-child(8){--k:8;background:#54bd85}.mastery-lesson-screen.is-victorious .mastery-lesson-sparkles{opacity:1}
@keyframes mastery-spark-fall{to{transform:translateY(110dvh) rotate(680deg);opacity:0}}
@keyframes mastery-victory-rise{from{opacity:0;transform:scale(.4) translateY(25px)}to{opacity:1;transform:none}}
@media(max-width:799px){
 .mastery-lesson-layout{padding:6px clamp(5px,1.5vw,14px);gap:5px}
 .mastery-lesson-header{min-height:41px;gap:9px}
 .mastery-lesson-back{width:36px;height:36px;border-radius:10px}
 .mastery-lesson-heading h2{font-size:clamp(.92rem,4vw,1.24rem)}
 .mastery-lesson-counter{min-width:68px}.mastery-lesson-counter strong{font-size:1rem}.mastery-lesson-counter span{font-size:.6rem}
 .mastery-lesson-progress-row{min-height:16px;grid-template-columns:minmax(0,1fr) auto;gap:8px}.mastery-lesson-progress-row progress{height:8px}.mastery-lesson-rating{font-size:.68rem;padding:4px 8px;min-width:68px}
 .mastery-lesson-main{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:8px;align-items:start;overflow:auto;padding-bottom:4px}
 .mastery-lesson-board-column{order:1;min-height:0;width:100%;align-items:flex-start}
 .mastery-lesson-panel{order:0;padding:10px 12px 12px;border-radius:16px;gap:9px;min-height:0;box-shadow:none;width:100%}
 .mastery-lesson-task h3{font-size:clamp(.85rem,3.5vw,1.05rem);margin:0 0 2px;line-height:1.2;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
 .mastery-lesson-kicker{display:none}
 .mastery-lesson-task p{min-height:0;font-size:clamp(.72rem,3.05vw,.85rem);line-height:1.35}
 .mastery-lesson-actions{gap:7px;flex-wrap:nowrap}
 .mastery-lesson-action{min-height:35px;min-width:0;padding:5px 8px;font-size:.77rem}
 .mastery-lesson-board-frame{width:100%!important;max-width:none;border-width:3px!important;border-radius:10px!important;box-shadow:0 8px 22px #103f301f!important}
 .mastery-lesson-meta{margin-bottom:6px;gap:7px}
 .mastery-lesson-finish{gap:11px;padding:8px}.mastery-lesson-finish-actions{gap:8px}
}
@media(max-height:550px){
 .mastery-lesson-layout{gap:3px;padding-block:3px}
 .mastery-lesson-header{min-height:32px}.mastery-lesson-back{height:32px;width:32px}
 .mastery-lesson-heading small{display:none}.mastery-lesson-heading h2{font-size:1rem}
 .mastery-lesson-task h3{font-size:.88rem}.mastery-lesson-task p{font-size:.75rem;line-height:1.25}
 .mastery-lesson-action{min-height:30px}.mastery-lesson-progress-row{min-height:12px}
}
@media(prefers-reduced-motion:reduce){.mastery-lesson-screen,.mastery-lesson-screen *, .mastery-lesson-screen *:before,.mastery-lesson-screen *:after{animation:none!important;transition:none!important}}
[data-theme="dark"] .mastery-lesson-screen{color:#213e34}