:root{--ink:#243e37;--muted:#6b7e73;--green:#326d52;--cream:#f6f5ef;--line:#dfe4d7}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Trebuchet MS',Arial,sans-serif}button,select{font:inherit}button{cursor:pointer;border:0;font-weight:700;color:var(--ink);border-radius:12px;padding:12px;background:#e9eee3}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #d99637;outline-offset:3px}button:disabled{opacity:.45;cursor:default}header{padding:20px 5%;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:12px;font-weight:700;font-size:24px}.brand small{display:block;font-size:9px;letter-spacing:2px;margin-top:5px;color:var(--muted)}#brand-icon{width:45px;height:49px;padding:4px;background:#dfeadb;border-radius:13px}.header-note{font-size:13px;color:var(--muted)}main{max-width:1340px;padding:30px;margin:auto}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:#7e907b}h1{font-size:38px;letter-spacing:-1.3px;margin:9px 0}p{line-height:1.6;color:var(--muted);margin:8px 0}h2{font-size:24px;letter-spacing:-.5px;margin:10px 0}h3{font-size:15px;margin:0 0 7px}.small{font-size:12px}.steps{display:flex;gap:18px;font-size:13px;color:#9aa594}.steps span{padding:11px 15px;border-radius:25px}.steps .active{background:#e5eddd;color:var(--green)}.steps b{margin-left:6px}.layout{display:grid;grid-template-columns:240px minmax(300px,570px) 260px;gap:24px;align-items:start}.panel{padding:23px;background:white;border:1px solid var(--line);border-radius:20px}.palette-label{font-size:11px;letter-spacing:1px;color:var(--muted);margin:19px 0 8px}.piece-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.piece-choice{padding:5px;background:#f4f5ee;border:2px solid transparent;min-width:0}.piece-choice svg{width:38px;height:43px;display:block;margin:auto}.piece-choice small{font-size:9px;font-weight:normal;display:block;margin-top:3px}.piece-choice.active,#erase.active{border:2px solid var(--green);background:#e8f0e1}.wide{width:100%;margin-top:12px}.primary{background:var(--green);color:white}.secondary{background:#f3f4ed;border:1px solid var(--line);font-size:12px}.field{margin:22px 0 10px}.field label{font-size:12px;font-weight:bold;display:block;margin-bottom:8px}select{background:white;border:1px solid #d8dfd1;border-radius:10px;padding:11px;width:100%;color:var(--ink)}.pair{display:flex;gap:8px;margin-top:10px}.pair button{flex:1}.board-shell{background:#fff;padding:12px;border:1px solid var(--line);border-radius:22px;box-shadow:0 10px 25px #243b330c}.board{display:grid;grid-template-columns:repeat(8,1fr);aspect-ratio:1;border:6px solid #728664;border-radius:8px;overflow:hidden}.sq{position:relative;aspect-ratio:1;border-radius:0;padding:0;background:#f0edd7;display:grid;place-items:center;min-width:0;touch-action:manipulation}.sq.dark{background:#98ad85}.piece{width:78%;height:86%;pointer-events:none;filter:drop-shadow(0 2px 1px #0002)}svg{width:100%;height:100%;display:block}.direction{display:flex;align-items:center;gap:10px;padding:9px 7px;min-height:60px}.direction b{font-size:10px;letter-spacing:1.1px}.direction small{display:block;font-size:11px;color:var(--muted);margin-top:4px}.direction strong{font-size:40px;line-height:1;margin-left:auto;color:#426c9b}.direction.bottom strong{color:#ba7a21}.mini-piece{width:25px;height:33px}.direction.bottom{padding-bottom:2px}.direction.top{padding-top:2px}.pawn-arrow{position:absolute;right:2px;top:4%;font-size:clamp(15px,2.2vw,27px);line-height:1;color:#234b7d;background:#e3effc;border-radius:6px;padding:0 2px;border:1px solid #fff9;pointer-events:none}.pawn-arrow.w{color:#8a5910;background:#fff1c9}.candidate:after{content:'';position:absolute;inset:4px;border:2px dashed #38594766;border-radius:8px;pointer-events:none}.mark{position:absolute;right:4px;bottom:4px;width:31%;height:31%;border:2px solid white;box-shadow:0 2px 4px #0003;border-radius:50%;display:grid;place-items:center;font-size:clamp(10px,1.5vw,19px);color:white;z-index:2;line-height:1}.sq:not(:has(.piece)) .mark{width:48%;height:48%;right:auto;bottom:auto}.green{background:#2f9e65}.red{background:#d86759}.error:before{content:'?';position:absolute;left:3px;top:2px;font-size:15px;color:#763a0b;background:#fff1bd;border-radius:50%;width:19px;height:19px;z-index:3}.coord{position:absolute;left:3px;bottom:2px;font-size:9px;color:#425741}.status{margin-top:15px;border:1px solid #dce3d3;border-radius:15px;background:#fff;padding:16px;line-height:1.55;font-size:13px;min-height:58px}.board-options{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin:15px 0;font-size:11px;color:var(--muted)}input{accent-color:var(--green)}.text-button{background:transparent;text-decoration:underline;padding:3px;font-size:11px}.guide-row{display:flex;align-items:center;gap:12px;border-radius:15px;padding:12px 10px;margin-top:14px}.white-guide{background:#fbf3df}.black-guide{background:#eaf0f8}.guide-row p{font-size:12px;margin:0}.pawn-card{display:flex;align-items:center;width:65px;flex-shrink:0}.pawn-card span{display:block;width:37px;height:48px}.pawn-card b{font-size:35px;color:#ae751e}.black-guide .pawn-card b{color:#426c9b}.divider{height:1px;background:var(--line);margin:22px 0}.moves{display:flex;justify-content:space-between;gap:8px;margin:13px 0}.moves div{text-align:center;flex:1}.moves b{font-size:26px;display:block;color:#487456;white-space:nowrap}.moves span{font-size:9px;display:block;margin-top:5px}.teacher-tip{background:#f1f4eb;padding:15px;border-radius:13px;margin-top:20px;font-size:12px}.teacher-tip small{color:var(--muted);line-height:1.5;display:block}.dot-tool{display:flex;align-items:center;gap:14px;background:white;border:2px solid var(--line);width:100%;text-align:left;margin-top:14px;padding:15px}.dot-tool.active{border-color:var(--green);background:#f1f6ed}.dot{width:35px;height:35px;display:grid;place-items:center;color:white;font-size:23px;border-radius:50%;flex-shrink:0}.dot-tool small{display:block;font-size:11px;font-weight:normal;color:var(--muted);margin-top:4px}footer{text-align:center;color:#83917f;font-size:12px;padding:20px}[hidden]{display:none!important}@media(max-width:1120px){.layout{grid-template-columns:210px 1fr}.direction-guide{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px 25px}.direction-guide>.eyebrow,.direction-guide>h2,.direction-guide>p{grid-column:1/-1}.divider{display:none}.teacher-tip{margin-top:0}.direction-guide>h3{grid-column:1/-1;margin-top:15px}}@media(max-width:650px){main{padding:20px 12px}.layout{display:flex;flex-direction:column;gap:16px}.tools,.board-area,.direction-guide{width:100%}header{padding:15px}.header-note{display:none}.intro{display:block}h1{font-size:31px}.steps{margin-top:15px}.panel{padding:18px}#palette{display:grid;grid-template-columns:1fr 1fr;gap:15px}.piece-grid{gap:4px}.piece-choice svg{width:30px;height:34px}.piece-choice small{font-size:8px}.palette-label{margin-top:10px}.pawn-arrow{font-size:19px}.mark{font-size:13px}.dot-tool{display:inline-flex;width:48%;padding:10px;vertical-align:top}.dot-tool+ .dot-tool{margin-left:2%}.direction-guide{display:block}.direction b{font-size:9px}.direction small{font-size:10px}.board-shell{padding:8px}.direction-guide .guide-row{display:inline-flex;width:48%;padding:8px;gap:4px}.guide-row h3{font-size:12px}.pawn-card{width:50px}.pawn-card span{width:28px}.pawn-card b{font-size:27px}.teacher-tip{margin-top:15px}}

/* Short, non-blocking classroom feedback. */
.board-shell{position:relative;isolation:isolate}
.celebration{position:absolute;inset:0;z-index:10;overflow:hidden;border-radius:22px;pointer-events:none;display:grid;place-items:center;animation:celebration-away .4s ease 5.3s both}
.celebration-card{position:relative;z-index:3;text-align:center;padding:24px 34px;background:#fffdf0f5;border:3px solid #edc55d;border-radius:25px;box-shadow:0 12px 40px #23413330;transform:rotate(-3deg);animation:celebration-pop .65s cubic-bezier(.2,.9,.3,1.3) both;max-width:88%}
.celebration-card strong{display:block;font-size:clamp(30px,4vw,46px);color:#326d52;letter-spacing:-1px}
.celebration-card>span{display:block;font-size:15px;margin-top:8px;color:#6a7d56}
.celebration-stars{color:#e9b334;font-size:34px;letter-spacing:7px;margin-bottom:9px}
.confetti{position:absolute;left:var(--left);top:-20px;width:10px;height:17px;background:var(--color);border-radius:3px;animation:confetti-fall 2.7s ease-in var(--delay) both}
.confetti:nth-child(3n){width:12px;height:12px;border-radius:50%}
.square-burst{position:absolute;inset:0;z-index:5;pointer-events:none;display:grid;place-items:center}
.burst-ring{width:30%;height:30%;border:3px solid #efad52;border-radius:50%;animation:burst-ring .65s ease-out both}
.burst-spark{position:absolute;left:calc(50% - 3px);top:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:#e6a23f;animation:burst-spark .75s ease-out both}
.burst-spark:nth-child(2n){background:#eb8c70}
.bursting .mark{animation:dot-wiggle .45s ease-in-out}
@keyframes celebration-pop{0%{opacity:0;transform:scale(.45) rotate(-10deg)}65%{opacity:1;transform:scale(1.08) rotate(2deg)}100%{transform:scale(1) rotate(-3deg)}}
@keyframes celebration-away{from{opacity:1}to{opacity:0}}
@keyframes confetti-fall{0%{opacity:0;transform:translate3d(0,0,0) rotate(0)}8%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translate3d(var(--drift),650px,0) rotate(var(--spin))}}
@keyframes burst-ring{0%{opacity:1;transform:scale(.3)}100%{opacity:0;transform:scale(2.5)}}
@keyframes burst-spark{0%{opacity:1;transform:translate(0,0) scale(.4)}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1)}}
@keyframes dot-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-15deg) scale(1.12)}75%{transform:rotate(15deg)}}
@media(prefers-reduced-motion:reduce){.celebration,.celebration-card,.bursting .mark{animation:none}.confetti,.balloon,.square-burst{display:none}.celebration-card{transform:none}.bursting{box-shadow:inset 0 0 0 4px #e5ab52}}

/* Board ends remain clear even when pawn arrows are hidden. */
.direction.top{background:#202522;color:#fff;padding:10px 12px;border-radius:12px 12px 5px 5px;margin-bottom:8px}
.direction.top small{color:#e0e6df}.direction.top strong{color:#fff}
.direction.top .mini-piece{background:#f0f2e9;border-radius:7px;padding:2px;width:29px;height:35px;flex-shrink:0}
.direction.bottom{background:#fff;color:#243e37;padding:10px 12px;border:1px solid #dfe4d7;border-radius:5px 5px 12px 12px;margin-top:8px}
.balloon{position:absolute;left:var(--left);top:110%;width:clamp(32px,5vw,53px);height:110px;z-index:1;animation:balloon-rise 4.4s ease-out var(--delay) both}
.balloon-body{position:absolute;inset:0 0 auto;height:65px;border-radius:50% 50% 46% 46%;background:radial-gradient(ellipse at 30% 25%,#ffffffb0 0%,#ffffff30 19%,transparent 45%),var(--color);box-shadow:inset -5px -5px 0 #00000010,0 4px 6px #00000010}
.balloon-body:after{content:'';position:absolute;left:calc(50% - 5px);bottom:-6px;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:8px solid var(--color)}
.balloon-string{position:absolute;top:71px;left:50%;width:10px;height:42px;border-left:1.5px solid #667969;border-radius:50%;transform:rotate(-8deg)}
.bursting{z-index:6;animation:cell-rumble .5s ease-in-out;box-shadow:inset 0 0 0 3px #e69b39}
.burst-star{position:absolute;width:94%;height:94%;background:#ffc75b;clip-path:polygon(50% 0%,60% 25%,79% 9%,76% 35%,100% 38%,81% 54%,97% 78%,68% 74%,64% 100%,48% 80%,24% 97%,28% 71%,0% 67%,23% 49%,4% 27%,33% 29%);animation:star-pop .85s ease-out both}
.burst-ring{position:absolute;width:45%;height:45%;border-width:4px;border-color:#e58b38;animation:burst-ring .85s ease-out var(--delay) both}
.burst-spark{width:8px;height:8px;left:calc(50% - 4px);top:calc(50% - 4px);animation-duration:1s;box-shadow:0 0 0 1px #fff9}
.burst-spark:nth-child(3n){border-radius:2px;background:#f1c149}
@keyframes balloon-rise{0%{top:110%;opacity:0;transform:translateX(0) rotate(-6deg)}8%{opacity:1}45%{transform:translateX(var(--sway)) rotate(7deg)}85%{opacity:1}100%{top:-35%;opacity:0;transform:translateX(0) rotate(-5deg)}}
@keyframes star-pop{0%{opacity:0;transform:scale(.1) rotate(-20deg)}18%{opacity:.95;transform:scale(1.1) rotate(5deg)}100%{opacity:0;transform:scale(.65) rotate(20deg)}}
@keyframes cell-rumble{0%,100%{transform:translate(0,0)}20%{transform:translate(-3px,1px)}40%{transform:translate(3px,-1px)}60%{transform:translate(-2px,1px)}80%{transform:translate(2px,0)}}
@media(max-width:650px){.balloon-body{height:48px}.balloon-string{top:54px;height:35px}}
@media(prefers-reduced-motion:reduce){.bursting{animation:none}.balloon{display:none}}

.dot-progress{font-size:12px;line-height:1.5;color:#48614e;background:#edf3e6;padding:10px;border-radius:9px;margin:16px 0 0}
.check-result,.board-result{padding:12px;border-radius:11px;font-size:13px;line-height:1.55;border:1px solid #ddc785;background:#fff3cf;color:#664b16}
.check-result{margin-top:12px}.board-result{margin-bottom:10px;font-weight:700}
.check-result.success,.board-result.success{background:#e5f4e9;border-color:#a3d2ac;color:#275d39}
.check-result.retry,.board-result.retry{background:#fff0e5;border-color:#e2b185;color:#79451c}
.missing-dot{position:absolute;width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#ffdc75;border:2px solid #fff4ca;color:#664610;font-size:19px;font-weight:bold;box-shadow:0 1px 4px #0002;z-index:4;pointer-events:none}
.sq:has(.piece) .missing-dot{right:3px;bottom:3px;width:23px;height:23px;font-size:16px}
.needs-dot:after{border:3px dashed #d59520;animation:missing-breathe 1.2s ease-in-out 2}
@keyframes missing-breathe{50%{border-color:#825509;transform:scale(.87)}}
@media(prefers-reduced-motion:reduce){.needs-dot:after{animation:none}}
/* Optional puzzle collection beside the open-ended classroom board. */
.classroom-modes{display:flex;gap:4px;padding:5px;border-radius:28px;background:#e7ebdf}.classroom-modes button{border-radius:22px;padding:10px 20px;font-size:13px;background:transparent}.classroom-modes .active{background:#fff;box-shadow:0 2px 6px #20362712}
.puzzle-library{padding:22px;background:#fff;border:1px solid var(--line);border-radius:20px;margin-bottom:24px}.puzzle-library-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.puzzle-progress{color:#886726;font-size:12px;background:#fff3d0;padding:7px 12px;border-radius:20px}
.puzzle-stages{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.stage-card{display:flex;align-items:center;gap:14px;text-align:left;border:2px solid #e7ebdf;border-radius:15px;background:#fafbf7;padding:16px 12px}.stage-card.active{border-color:#487550;background:#edf3e5}.stage-icon{display:block;width:43px;height:49px;flex-shrink:0}.stage-card small{display:block;letter-spacing:1px;font-size:9px;color:#7b8b73;margin-bottom:6px}.stage-card b{display:block;font-size:16px}.stage-card span>span{display:block;font-size:11px;font-weight:normal;color:#74856e;margin-top:5px}
.puzzle-picker{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:18px;flex-wrap:wrap}.puzzle-levels{display:flex;gap:6px;flex-wrap:wrap}.level-choice{background:#f2f4ed;border:1px solid transparent;padding:10px 13px;font-size:12px}.level-choice.active{border-color:#64805d;background:#e8eee0}.puzzle-numbers{display:flex;gap:7px}.puzzle-number{width:42px;height:40px;padding:0;border:1px solid #dfe5d6;background:white;font-size:12px}.puzzle-number.active{background:#326d52;color:white;border-color:#326d52}.puzzle-number.solved:not(.active){background:#fcf1cd;color:#886523;border-color:#ebd794}.puzzle-note{font-size:11px;margin:14px 0 0;color:#839079}
.puzzle-mission{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px;padding:2px 3px}.puzzle-mission h2{font-size:23px;margin:8px 0}.puzzle-mission p{font-size:12px;line-height:1.55;margin:0}.puzzle-star{font-size:39px;color:#d5a035;flex-shrink:0}.puzzle-controls{display:flex;gap:10px;margin-top:14px}.puzzle-controls .primary{flex:1}.puzzle-controls button{min-height:45px}
@media(max-width:850px){.stage-card{gap:8px;padding:12px 9px}.stage-icon{width:30px;height:38px}.stage-card b{font-size:13px}.stage-card span>span{font-size:10px}}
@media(max-width:650px){.classroom-modes button{padding:9px 11px;font-size:11px}.brand{font-size:20px}.puzzle-library{padding:15px}.puzzle-stages{grid-template-columns:1fr;gap:7px}.stage-card{padding:10px 12px}.stage-card b{font-size:14px}.stage-card small{margin-bottom:3px}.stage-card span>span{margin-top:3px}.stage-icon{width:32px;height:40px}.puzzle-picker{gap:12px;margin-top:14px}.puzzle-levels{width:100%}.level-choice{flex:1;min-width:85px;padding:10px 7px;font-size:10px}.puzzle-numbers{width:100%;justify-content:center}.puzzle-number{width:48px}.puzzle-note{text-align:center}.puzzle-mission h2{font-size:21px}.puzzle-controls{margin-bottom:4px}}
/* Teacher collection and guided explanations. */
.saved-tools{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}.saved-tools h3{margin-top:9px;font-size:18px}.saved-tools label{display:block;font-size:11px;font-weight:bold;margin:14px 0 7px}.saved-tools input{width:100%;padding:11px;border:1px solid #d8dfd1;border-radius:10px;font:inherit;font-size:12px;color:var(--ink);background:white}.saved-tools select{font-size:12px}.saved-tools .pair button{padding:10px 6px}.saved-tools #restore-exercise{margin-top:10px}#save-status{overflow-wrap:anywhere}
.board-stage{position:relative}.explanation-arrows{position:absolute;inset:6px;width:calc(100% - 12px);height:calc(100% - 12px);pointer-events:none;z-index:8;overflow:visible}.explain-target{box-shadow:inset 0 0 0 5px #efa82e!important}.explain-source .piece{filter:drop-shadow(0 0 5px #fff) drop-shadow(0 0 5px #da831b)}.explanation{margin-top:14px;background:#fff6dc;border:1px solid #e8c978;padding:16px;border-radius:15px}.explanation-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.explanation p{font-size:14px;color:#6c5429}.explanation .secondary{margin-top:6px}.why-button{background:#ffedba;color:#75500c;border:1px solid #e0bf74;min-height:46px}
@media(max-width:650px){.saved-tools .pair button{min-height:42px}.explanation p{font-size:13px}}
/* Three welcoming entry points, with the familiar teaching board inside. */
.home-page{padding:28px 0 22px}.home-intro{text-align:center;margin:4px auto 40px;max-width:650px}.home-intro h1{font-size:clamp(40px,5vw,65px);line-height:1.06;letter-spacing:-2.5px;margin:18px 0}.home-intro p{font-size:16px;line-height:1.7}.home-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.home-card{text-align:left;padding:28px;border-radius:23px;border:1px solid #dce3d2;background:white;box-shadow:0 7px 20px #263c2e06;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;align-items:flex-start}.home-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px #263c2e12}.home-card h2{font-size:30px;margin:10px 0 5px}.home-card p{font-weight:normal;font-size:14px;flex:1}.home-card .card-link{width:100%;display:flex;justify-content:space-between;align-items:center;padding-top:22px;font-size:13px;margin-top:18px;border-top:1px solid #dee6d4}.card-link b{font-size:21px}.home-art{width:155px;height:155px;display:grid;grid-template-columns:repeat(4,1fr);border:7px solid #799368;border-radius:13px;overflow:hidden;margin:0 auto 28px;transform:rotate(-5deg);box-shadow:5px 7px 0 #dce5d0}.mini-square{display:grid;place-items:center;background:#f0edd7}.mini-square.mini-dark{background:#9eb386}.mini-square svg{width:82%;height:82%}.mini-square i{height:17px;width:17px;border-radius:50%;background:#3caa74;border:2px solid #f5fff8}.puzzle-card{background:#fffcf2}.puzzle-card .home-art{transform:rotate(4deg);box-shadow:5px 7px 0 #ede2bc}.game-card{background:#f3f7f9}.game-card .home-art{transform:rotate(-2deg);box-shadow:5px 7px 0 #dbe7ec}.home-footnote{text-align:center;margin-top:34px;font-size:12px;letter-spacing:.3px}
/* Full legal chess, played together on one device. */
.game-layout{display:grid;grid-template-columns:210px minmax(300px,600px) 230px;gap:24px;align-items:start}.game-badge{font-size:12px;background:#e6eddf;padding:10px 16px;border-radius:25px}.game-turn{padding:15px 18px;margin-bottom:13px;background:#e6efdf;border:1px solid #d2dfc6;border-radius:13px;font-weight:bold;font-size:20px;line-height:1.35}.game-turn.in-check{background:#fff0d1;border-color:#dfb365;color:#835315}.game-turn.finished{background:#fff4c4;border-color:#dfc260;color:#7e6122}.game-player{min-height:52px;padding:9px 11px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:9px;font-size:12px}.game-player:first-child{margin-bottom:9px}.game-player:last-child{margin-top:9px}.black-player{background:#202522;color:white}.white-player{background:#fffdf6;border:1px solid #e3e3d7;color:#263d32}.captured-pieces{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:1px;max-width:60%}.captured-pieces span{width:19px;height:23px}.black-player .captured-pieces{background:#465148;border-radius:5px}.game-selected{box-shadow:inset 0 0 0 5px #287952!important}.last-move{background:#eddd86}.last-move.dark{background:#b6b56c}.checked-king{box-shadow:inset 0 0 0 5px #ce6a50}.legal-target{position:absolute;width:22%;height:22%;border-radius:50%;background:#28644299;pointer-events:none}.capture-target{width:85%;height:85%;background:transparent;border:5px solid #286442bb}.game-legend{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin:14px 0;font-size:11px;color:#7d8b73}.move-head,.move-row{display:grid;grid-template-columns:26px 1fr 1fr;gap:9px;padding:9px 6px;font-size:13px}.move-head{font-size:11px;color:#7d8b73;border-bottom:1px solid var(--line)}.move-row:nth-child(even){background:#f2f5ec;border-radius:6px}.move-row span:first-child{color:#8a957f}.move-list{max-height:390px;overflow:auto;min-height:80px}.game-dialog{border:1px solid #d4dfc8;border-radius:22px;padding:25px;max-width:min(420px,92vw);width:100%;color:var(--ink);box-shadow:0 18px 60px #0003}.game-dialog::backdrop{background:#152b2266;backdrop-filter:blur(3px)}.promotion-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:18px 0}.promotion-choices button{padding:9px 5px;background:#eef3e7}.promotion-choices svg{height:60px}.promotion-choices span{display:block;font-size:11px;margin-top:6px}.game-center{min-width:0}.game-tools .wide{min-height:44px}
@media(max-width:1100px){.game-layout{grid-template-columns:190px minmax(0,1fr)}.game-history{grid-column:1/-1}.move-list{max-height:200px}.home-card{padding:22px}.home-art{width:135px;height:135px}}
@media(max-width:650px){header{gap:14px;flex-wrap:wrap;justify-content:center}.classroom-modes{width:100%;justify-content:center}.classroom-modes button{flex:1}.home-page{padding:10px 0}.home-intro{margin-bottom:26px}.home-intro h1{font-size:43px;letter-spacing:-1.5px}.home-intro p{font-size:14px}.home-cards{grid-template-columns:1fr;gap:16px}.home-card{padding:22px;display:grid;grid-template-columns:1fr 100px;gap:0 18px}.home-card .home-art{grid-column:2;grid-row:1/5;width:94px;height:94px;margin:auto}.home-card .eyebrow,.home-card h2,.home-card p,.home-card .card-link{grid-column:1}.home-card h2{font-size:26px}.home-card p{font-size:12px}.home-card .card-link{padding-top:10px;margin-top:12px;font-size:12px}.home-art .mini-square i{width:12px;height:12px}.game-layout{display:flex;flex-direction:column;gap:16px}.game-center{order:0;width:100%}.game-tools{order:1;width:100%}.game-history{order:2;width:100%}.game-tools h2 br{display:none}.game-turn{font-size:17px}.game-badge{display:none}.game-player{font-size:11px}.game-legend{gap:10px}.game-tools .wide{width:48%;display:inline-block}.game-tools .wide:nth-of-type(even){margin-left:2%}.game-tools .divider{margin:12px 0}.game-tools h2{font-size:22px}.captured-pieces span{width:15px;height:20px}}
@media(prefers-reduced-motion:reduce){.home-card{transition:none}.home-card:hover{transform:none}}

.game-mode-picker{display:grid;gap:8px;margin:16px 0}.game-mode-picker button{background:#fffaf0;border:2px solid #dfdacb;border-radius:14px;padding:12px;text-align:left;color:#26392e;cursor:pointer}.game-mode-picker button[aria-pressed="true"]{background:#e3eddc;border-color:#547551;box-shadow:0 0 0 1px #547551}.game-mode-picker b,.game-mode-picker span{display:block}.game-mode-picker b{font-size:15px}.game-mode-picker span{font-size:12px;margin-top:4px}.game-coordinates{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;margin:18px 0;cursor:pointer}.game-coordinates input{width:19px;height:19px;accent-color:#547551}

/* Stable board geometry: pieces and overlays cannot resize grid tracks. */
.board{width:100%;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));overflow-anchor:none}
.sq{width:100%;height:100%;min-height:0;aspect-ratio:auto;overflow:hidden}
.board-area,.board-stage,.game-center,.board-shell{min-width:0}
.game-player{height:54px;min-height:54px;flex-wrap:nowrap;overflow:hidden}
.game-player strong{flex-shrink:0}.captured-pieces{min-width:0;flex-wrap:nowrap;overflow-x:auto}
#game-turn{min-height:58px}#game-notice{min-height:96px}.board-result{margin-top:12px}
button,label{touch-action:manipulation}
@media(max-width:650px){input:not([type="checkbox"]),select,.saved-tools input,.saved-tools select{font-size:16px}#check-result{display:none!important}#why[hidden]{display:block!important;visibility:hidden}.game-player{height:48px;min-height:48px}.game-player strong{font-size:11px}#game-turn{min-height:56px}}

.sq.computer-moving{overflow:visible;z-index:7}.computer-moving .piece{will-change:transform}

.game-win-popup{position:absolute;inset:0;z-index:15;display:grid;place-items:center;pointer-events:none;overflow:hidden;border-radius:22px}
.game-win-card{position:relative;z-index:3;pointer-events:auto;text-align:center;background:#fffdf4f7;border:3px solid #8ca27a;border-radius:24px;padding:35px 24px 25px;width:min(90%,360px);box-shadow:0 12px 40px #17362240;animation:game-win-pop .3s ease-out}
.game-win-card h2{font-size:clamp(28px,4vw,42px);line-height:1.15;margin:10px 0}.game-win-card p{font-size:14px;margin:8px 0;color:#526747}.game-win-close{position:absolute;right:7px;top:5px;min-width:44px;min-height:44px;padding:3px;font-size:25px;background:transparent}
.game-win-stars{display:none;color:#c68b14;font-size:30px;letter-spacing:5px}.player-win .game-win-stars{display:block}.player-win .game-win-card{border-color:#edc55d}
.game-win-effects{position:absolute;inset:0;overflow:hidden;pointer-events:none}.game-win-effects .balloon{animation-duration:2.7s}.game-win-effects .confetti{animation-duration:2.4s}
@keyframes game-win-pop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.game-win-card{animation:none}.game-win-effects{display:none}}

.game-review{margin-top:24px}.review-summary{font-weight:bold;color:#526747;line-height:1.8}.review-moment{padding:16px 18px;margin-top:12px;border:1px solid #e3dfc9;border-left:4px solid #d5ad54;border-radius:12px;background:#fffcf2}.review-moment h3{line-height:1.6;margin:0}.review-moment p{font-size:14px}.review-moment .small,.review-method p{font-size:12px}.review-method{margin-top:20px;color:#6b7e73;line-height:1.6}.review-method summary{cursor:pointer;font-size:13px}.game-review>h2{margin-top:8px}

.account-bar{max-width:1280px;margin:0 auto;padding:12px 30px;display:flex;gap:15px;align-items:center;justify-content:space-between;font-size:12px;color:#657a65}.account-bar a{color:#326d52;font-weight:bold;white-space:nowrap}.account-primary{display:inline-block;padding:13px 20px;background:#326d52;color:#fff;text-decoration:none;border-radius:12px;margin:14px 0}.guest-invite{max-width:720px}.progress-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.progress-cards article{background:white;border:1px solid #dfe4d7;border-radius:18px;padding:22px}.progress-cards strong{display:block;font-size:32px}.progress-cards span{display:block;font-size:13px;color:#6b7e73;margin-top:6px}.milestone{padding:18px;background:#fff2c9;border-radius:14px;margin:22px 0;color:#79602c}.dashboard-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.saved-game-row{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #e4e8dc;padding:16px 0}.saved-game-row small{display:block;margin-top:7px;color:#71816e}.saved-game-row button{flex-shrink:0}.import-panel{margin-top:20px}.import-panel p{font-size:13px}
@media(max-width:650px){.account-bar{padding:12px;align-items:flex-start;font-size:11px}.progress-cards{grid-template-columns:repeat(2,1fr);gap:9px}.progress-cards article{padding:15px}.progress-cards strong{font-size:25px}.classroom-modes button{padding:9px 6px;font-size:10px}.saved-game-row strong{font-size:13px}}

/* Optional account forms; the chess boards remain accessible to guests. */
.auth-dialog{box-sizing:border-box;width:min(460px,calc(100vw - 28px));max-height:90dvh;overflow:auto;border:1px solid #dedbcf;border-radius:24px;background:#fffdf7;color:#263b30;padding:28px;box-shadow:0 24px 80px #122c3540}
.auth-dialog::backdrop{background:#122c3570;backdrop-filter:blur(3px)}
.auth-dialog h2{font-size:28px;margin:20px 0 6px}.auth-dialog p{line-height:1.5}.auth-close{position:absolute;right:12px;top:10px;font-size:24px;padding:2px 10px}.auth-tabs{display:flex;gap:8px;margin:20px 0}.auth-tabs button{flex:1;background:#eeede6;color:#263b30}.auth-tabs button[aria-pressed=true]{background:#255d49;color:white}
.auth-dialog label{display:block;font-weight:700;margin:14px 0 0}.auth-dialog [hidden]{display:none!important}.auth-dialog input{box-sizing:border-box;display:block;width:100%;min-height:46px;padding:11px 12px;margin-top:6px;border:1px solid #b8c6b9;border-radius:10px;font:inherit;font-size:16px;background:white;color:#263b30}.auth-dialog input:focus{outline:3px solid #b9d9c6;outline-offset:1px}.auth-wide{width:100%;min-height:44px}.auth-divider{text-align:center;color:#68766b;font-size:13px}.auth-link{display:block;margin:12px auto;background:transparent;color:#255d49;text-decoration:underline;padding:8px}.auth-note{font-size:13px;color:#68766b;text-align:center}#auth-message{font-size:14px;min-height:1em;color:#635029}.auth-dialog button:disabled{opacity:.6;cursor:wait}

/* Version 20: desktop sidebar and a compact, board-focused mobile layout. */
:root{--sidebar-width:224px}
body{padding-left:var(--sidebar-width)}
main{padding:28px;max-width:1320px;min-width:0}main>section{min-width:0}
.mobile-header{display:none}.app-sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-width);height:100dvh;max-height:none;max-width:none;margin:0;border:0;border-right:1px solid #dce3d5;background:#edf1e7;color:var(--ink);padding:24px 16px;overflow:auto;z-index:30;flex-direction:column;gap:0}.app-sidebar[open]{display:flex}
.sidebar-top{display:flex;align-items:center;justify-content:space-between}.app-sidebar .brand{font-size:22px;gap:9px}.app-sidebar #brand-icon{width:36px;height:42px;background:#dce8d5}.app-sidebar .brand small{font-size:8px;letter-spacing:1px}.menu-close{display:none}.sidebar-caption{font-size:10px;text-transform:uppercase;letter-spacing:1.4px;margin:36px 8px 12px}
.app-sidebar .classroom-modes{display:flex;flex-direction:column;border-radius:0;background:transparent;padding:0;gap:6px;flex-shrink:0;width:100%}.app-sidebar .nav-item{display:flex;align-items:center;gap:12px;flex:none;min-height:48px;width:100%;border-radius:12px;text-align:left;font-size:14px;padding:12px;color:#48634f}.app-sidebar .nav-item:hover{background:#e1e8da}.app-sidebar .nav-item.active{background:#326d52;color:white;box-shadow:none}.nav-icon{width:24px;text-align:center;font-size:21px;line-height:1}.app-sidebar #help-mode{margin-top:14px;border-top:1px solid #d5dfcd;border-radius:0 0 12px 12px;padding-top:16px}
.sidebar-account{margin-top:auto;padding:24px 6px 0}.sidebar-account>p{font-size:12px;line-height:1.6}.account-actions{display:flex;flex-direction:column;gap:8px;margin-top:16px}.account-actions a{display:block;text-align:center;padding:12px;border-radius:10px;text-decoration:none;font-size:13px;font-weight:700;min-height:44px}.sidebar-signup{background:#326d52;color:white}.sidebar-login{background:#fff;color:#326d52;border:1px solid #cedac5}.sidebar-account #account-status{font-size:11px;margin-top:12px;overflow-wrap:anywhere}.sidebar-footnote{margin:20px 6px 0;font-size:11px;color:#7e907b}
.layout{grid-template-columns:190px minmax(0,1fr) 210px;gap:18px}.game-layout{grid-template-columns:190px minmax(0,1fr) 210px;gap:18px}.board-area,.game-center{width:100%;max-width:600px;justify-self:center}.tools,.game-tools,.game-history{min-width:0;padding:18px}.panel{overflow-wrap:anywhere}.compact-panel>summary,.puzzle-library>summary,.saved-tools>summary{cursor:pointer;font-weight:700;color:#326d52;font-size:14px;min-height:44px;padding:10px 0}.compact-panel>summary span,.puzzle-library>summary span,.saved-tools>summary span{display:block;font-size:11px;color:var(--muted);font-weight:400;margin:4px 0}.compact-panel .panel-content{min-width:0}.puzzle-library>summary,.compact-panel>summary{display:none}.saved-tools>summary{display:list-item}.saved-tools h3{display:none}.direction-guide{display:block}.direction-guide .divider{display:block}.direction-guide .panel-content{display:block}
.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.help-grid p{font-size:14px}.help-grid button{margin-top:16px}.help-faq details{border-bottom:1px solid var(--line);padding:13px 0}.help-faq summary{font-weight:700;cursor:pointer;min-height:30px;line-height:1.5}.help-faq p{padding-top:8px}.help-trouble{margin-top:20px}.help-trouble p{font-size:14px}.help-trouble button{margin-top:12px}
@media(min-width:981px) and (max-width:1360px){.layout,.game-layout{grid-template-columns:180px minmax(0,1fr)}.direction-guide,.game-history{grid-column:1/-1}.direction-guide .panel-content{display:grid;grid-template-columns:1fr 1fr;gap:6px 22px}.direction-guide .panel-content>.eyebrow,.direction-guide .panel-content>h2,.direction-guide .panel-content>p{grid-column:1/-1}.direction-guide .divider{display:none}.home-card{padding:20px}.home-art{width:120px;height:120px}.home-card h2{font-size:25px}}
@media(max-width:980px){
 body{padding-left:0}.mobile-header{display:flex;position:sticky;top:0;z-index:20;justify-content:space-between;flex-wrap:nowrap;background:#f6f5eff5;border-bottom:1px solid var(--line);padding:10px 16px;min-height:60px;backdrop-filter:blur(8px)}.mobile-brand{display:flex;align-items:center;gap:9px;font-size:20px;font-weight:700;text-decoration:none;color:var(--ink)}.mobile-brand img{border-radius:9px}#menu-toggle{display:flex;align-items:center;gap:7px;font-size:12px;min-height:40px;padding:8px 11px;background:#e8eee1}#menu-toggle span{font-size:19px}
 .app-sidebar{width:min(310px,85vw);padding:22px 18px;box-shadow:10px 0 50px #18332b25}.app-sidebar::backdrop{background:#112c2266;backdrop-filter:blur(2px)}.app-sidebar .menu-close{display:block;min-width:44px;height:44px;font-size:24px;background:transparent;padding:4px}.app-sidebar .sidebar-caption{margin-top:24px}.sidebar-account{padding-top:22px}.sidebar-footnote{margin-top:12px}body.menu-open{overflow:hidden}
 main{padding:20px 16px;max-width:820px}.intro{margin-bottom:18px}h1{font-size:31px}.layout{display:flex;flex-direction:column;gap:14px}.tools,.board-area,.direction-guide{width:100%;max-width:none}.game-layout{display:flex;flex-direction:column;gap:14px}.game-center{order:0;max-width:600px;align-self:center}.game-tools{order:1;width:100%;max-width:600px;align-self:center}.game-history{order:2;width:100%;max-width:600px;align-self:center}.game-tools>summary,.direction-guide>summary,.puzzle-library>summary{display:list-item}.compact-panel .panel-content{padding-top:12px}.game-tools h2{font-size:21px}.game-tools .wide{width:100%;margin-left:0!important}.game-tools .panel-content{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}.game-tools .panel-content>.eyebrow,.game-tools h2,.game-mode-picker,.game-tools .field,.game-tools p,.game-tools .divider{grid-column:1/-1}.game-tools .wide{margin-top:0}.game-tools .game-coordinates{margin:0;min-height:40px;display:flex;align-items:center;gap:7px;font-size:12px}.game-tools .divider{display:none}.game-mode-picker{margin:0}.game-tools .field{margin:8px 0}.game-history .move-list{max-height:150px}.game-badge{display:none}
 .direction-guide{padding:12px 18px}.direction-guide .panel-content{display:block}.puzzle-library{padding:10px 16px;margin-bottom:16px}.puzzle-library .panel-content{padding-top:10px}.puzzle-library-heading{margin-bottom:10px}.puzzle-stages{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.stage-card{padding:9px;display:flex;flex-direction:column;gap:5px}.stage-card span>span{display:none}.stage-card b{font-size:11px}.stage-card small{font-size:8px}.stage-icon{width:28px;height:32px}.puzzle-note{font-size:11px}.puzzle-mission h2{font-size:23px}.puzzle-mission{margin-bottom:10px}.puzzle-levels{width:auto}.puzzle-picker{gap:10px}.level-choice{min-width:0;padding:10px;font-size:12px}
 .home-page{padding:8px 0}.home-intro{text-align:left;margin:0 0 22px;max-width:none}.home-intro h1{font-size:40px;letter-spacing:-1.3px;margin:12px 0;line-height:1.06}.home-intro p{font-size:14px;line-height:1.55}.home-cards{grid-template-columns:1fr;gap:12px}.home-card{padding:18px;display:grid;grid-template-columns:minmax(0,1fr) 86px;gap:0 14px;min-height:155px;border-radius:18px}.home-card .home-art{grid-column:2;grid-row:1/5;width:78px;height:78px;margin:auto;border-width:4px;border-radius:9px;box-shadow:3px 4px 0 #dce5d0}.home-card .eyebrow,.home-card h2,.home-card p,.home-card .card-link{grid-column:1}.home-card h2{font-size:23px;margin:6px 0}.home-card p{font-size:12px;line-height:1.5;margin:0}.home-card .eyebrow{font-size:9px;letter-spacing:1px}.home-card .card-link{border-top:0;padding-top:0;margin-top:10px;font-size:12px}.home-footnote{margin-top:20px}.home-card:hover{transform:none}
 .tools{padding:14px 16px}.tools h2{font-size:21px;margin:5px 0}.tools #palette{display:grid;grid-template-columns:1fr 1fr;gap:12px}.piece-grid{gap:4px}.palette-label{margin:8px 0 6px;font-size:10px}.piece-choice{padding:3px}.piece-choice svg{width:26px;height:30px}.piece-choice small{font-size:8px}.tools #setup-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}.tools #setup-tools>.eyebrow,.tools #setup-tools>h2,.tools #setup-tools>p,.tools #palette,.tools #setup-tools>.pair{grid-column:1/-1}.tools .field{margin:0}.tools .field label{margin:0 0 4px;font-size:11px}.tools #erase{align-self:end;min-height:44px;margin:0}.tools #start{grid-column:1/-1;margin:0;min-height:44px}.tools #setup-tools>.pair{margin:0}.tools #setup-tools>.pair button{padding:9px}.tools .saved-tools{margin-top:12px;padding-top:4px}.saved-tools>.panel-content{padding-top:8px}.saved-tools>.panel-content>.eyebrow{display:none}
 .dot-tool{width:48%;padding:9px;margin-top:8px;min-height:55px}.dot-tool+.dot-tool{margin-left:2%}.dot-tool small{font-size:10px}.dot-tool .dot{width:28px;height:28px;font-size:18px}.dot-progress{margin-top:8px;font-size:11px;padding:7px}.tools #play-tools>.small{margin:5px 0;font-size:11px}.tools #play-tools h2{font-size:20px}.tools #play-tools .wide{margin-top:8px}.tools #play-tools #reset,.tools #play-tools #edit{display:inline-block;width:48%;font-size:11px;padding:9px}.tools #play-tools #edit{margin-left:2%}.board-options{gap:8px 14px;margin:10px 0}.board-options label{min-height:36px;display:flex;align-items:center;gap:5px}.status{margin-top:10px;padding:12px;min-height:46px;font-size:12px}.direction{min-height:46px}.direction.top,.direction.bottom{padding:7px 10px}.direction strong{font-size:29px}.direction small{font-size:10px}.direction b{font-size:9px}.board-shell{padding:7px;border-radius:16px}.board{border-width:4px}.game-turn{font-size:17px;padding:10px 13px;margin-bottom:9px;min-height:44px!important}.game-player{height:39px;min-height:39px;padding:7px 9px}.game-player:first-child{margin-bottom:7px}.game-player:last-child{margin-top:7px}.game-legend{font-size:10px;margin:10px 0;gap:10px}.game-review{margin-top:18px}.help-grid{grid-template-columns:1fr;gap:14px}.help-trouble{margin-top:14px}.progress-cards article{padding:14px}.progress-cards strong{font-size:26px}.progress-cards span{font-size:12px}.account-primary{margin:10px 8px 10px 0}.panel{border-radius:16px}.auth-dialog{width:min(430px,calc(100vw - 24px));padding:24px 20px;max-height:calc(100dvh - 24px)}
}
@media(max-width:420px){main{padding:16px 10px}.mobile-header{padding:9px 12px}.home-intro h1{font-size:34px}.home-card{padding:15px;grid-template-columns:minmax(0,1fr) 70px}.home-card .home-art{width:65px;height:65px}.home-card p{font-size:11px}.home-card h2{font-size:21px}.intro h1{font-size:27px}.intro p{font-size:12px}.steps{gap:5px;margin-top:8px}.steps span{padding:6px 10px;font-size:11px}.puzzle-mission h2{font-size:20px}.puzzle-controls button{font-size:11px;padding:10px}.game-tools .panel-content{gap:8px}.game-tools .wide{font-size:11px}.saved-game-row{gap:8px}.saved-game-row button{padding:10px}.progress-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.help-grid .panel{padding:18px}.pawn-arrow{font-size:16px}}
@media(prefers-reduced-motion:reduce){.mobile-header{backdrop-filter:none}.app-sidebar::backdrop{backdrop-filter:none}}
/* Optional explanations are independent of legal-move dots and last-move colour. */
.game-coaching{margin-top:10px;padding:13px 16px;border:1px solid #c8dbc4;border-left:4px solid #61905c;background:#edf5e8;border-radius:12px;min-height:86px}
.game-coaching h3{font-size:12px;margin:0 0 5px;color:#326d52}.game-coaching p{font-size:12px;margin:0;line-height:1.55;color:#425f48}
#game-difficulty-note{margin-top:7px}#game-difficulty-field select{font-size:14px}.game-player strong{min-width:0;overflow-wrap:anywhere}
@media(max-width:980px){#game-difficulty-field select{font-size:16px}.game-coaching{padding:11px 13px;min-height:84px}.game-coaching p{font-size:12px}.game-player strong{font-size:10px}.game-player{gap:6px}}
/* Account management and private feedback. */
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.settings-identity p{overflow-wrap:anywhere}.settings-grid p,.feedback-panel p,.privacy-content p,.privacy-content li{font-size:14px}.settings-grid label,.feedback-panel label,#settings-delete-form>label{display:block;font-size:13px;font-weight:700;margin:16px 0 7px}.settings-grid input,.feedback-panel input,.feedback-panel textarea,#settings-delete-text{box-sizing:border-box;width:100%;font:inherit;font-size:16px;padding:11px;border:1px solid #ccd8c4;border-radius:10px;background:white;color:var(--ink)}.settings-grid button,.feedback-panel button{margin-top:16px;min-height:44px}.feedback-panel{max-width:720px}.feedback-panel textarea{resize:vertical;min-height:140px}.feedback-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.danger-button{background:#a44239;color:white}.settings-danger{border-color:#deb7ad}.delete-ack{display:flex!important;align-items:flex-start;gap:8px;line-height:1.5}.delete-ack input{margin-top:3px;flex-shrink:0}.privacy-content{max-width:850px}.privacy-content h2{font-size:21px;margin-top:26px}.privacy-content h2:first-child{margin-top:0}.privacy-content a,.feedback-panel a{color:#326d52}.privacy-content li{line-height:1.7;margin:8px 0}.footer-links{display:flex;gap:18px;justify-content:center;margin-top:12px;flex-wrap:wrap}.footer-links a{color:#526d55}.account-notice{background:#e4f0de;border:1px solid #bacfaa;padding:14px;border-radius:12px;margin:0 0 18px;color:#326d52}
@media(max-width:980px){.settings-grid{grid-template-columns:1fr;gap:14px}.settings-grid .panel{padding:18px}.settings-grid h2{font-size:21px}.privacy-content{padding:20px}.privacy-content h2{font-size:20px}.settings-grid p,.privacy-content p,.privacy-content li{font-size:13px}.app-sidebar .sidebar-caption{margin-top:18px}.app-sidebar .classroom-modes{gap:3px}.app-sidebar .nav-item{min-height:42px;padding:9px 12px}.sidebar-account{padding-top:18px}.footer-links{gap:14px}.feedback-panel{padding:18px}}
/* Help is one destination; account Appearance is available to every visitor. */
.info-tabs{display:flex;gap:8px;margin:0 0 22px;padding:6px;background:#e7ecdf;border-radius:14px;max-width:660px}
.info-tabs button{flex:1;min-width:0;min-height:44px;padding:11px 14px;font-size:13px;background:transparent;color:#48634f;border-radius:10px}
.info-tabs button[aria-selected=true]{background:#fff;color:#326d52;box-shadow:0 2px 6px #20362712}
.info-panel:focus-visible{outline:3px solid #d99637;outline-offset:5px;border-radius:16px}
.appearance-panel{margin-bottom:20px;max-width:850px}.appearance-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border:0;padding:0;margin:16px 0 10px}
.appearance-options label{display:flex;align-items:center;gap:9px;min-height:64px;padding:12px;border:1px solid var(--line);border-radius:12px;cursor:pointer;background:#f7f8f2;font-weight:700;font-size:14px}
.appearance-options label:has(input:checked){background:#e9f1e1;border:2px solid #487550;padding:11px}.appearance-options small{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:4px}.appearance-options input{margin:0;flex-shrink:0}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html[data-theme=light]{color-scheme:light}
/* Light continues to use the original palette. Dark overrides interface surfaces only. */
html[data-theme=dark]{color-scheme:dark;--ink:#e3eadf;--muted:#acbdaf;--cream:#18231e;--line:#405145;--green:#82bf96}
html[data-theme=dark] .panel,html[data-theme=dark] .board-shell,html[data-theme=dark] .puzzle-library,html[data-theme=dark] .home-card,html[data-theme=dark] .auth-dialog,html[data-theme=dark] .game-dialog{background:#243228;border-color:#405145;color:#e3eadf}
html[data-theme=dark] .app-sidebar{background:#1e2b22;border-color:#405145;color:#e3eadf}
html[data-theme=dark] .app-sidebar .brand,html[data-theme=dark] .mobile-brand{color:#e3eadf}
html[data-theme=dark] .mobile-header{background:#18231ef5;border-color:#405145}
html[data-theme=dark] .app-sidebar .nav-item{color:#c9d9c7}
html[data-theme=dark] .app-sidebar .nav-item:hover{background:#304236}
html[data-theme=dark] .app-sidebar .nav-item.active{background:#397452;color:#fff}
html[data-theme=dark] .app-sidebar #help-mode{border-color:#405145}
html[data-theme=dark] .eyebrow,html[data-theme=dark] .sidebar-caption,html[data-theme=dark] .sidebar-footnote,html[data-theme=dark] .home-footnote,html[data-theme=dark] .brand small{color:#b2c8aa}
html[data-theme=dark] .sidebar-account #account-status{color:#b5c8b2}
html[data-theme=dark] .sidebar-account>p{color:#acbdaf}
html[data-theme=dark] button:where(:not(.sq):not(.piece-choice)){background:#334637;color:#e3eadf;border-color:#506752}
html[data-theme=dark] button.primary,html[data-theme=dark] .sidebar-signup,html[data-theme=dark] .account-primary{background:#397452;color:#fff}
html[data-theme=dark] button.danger-button{background:#a4423b;color:#fff}
html[data-theme=dark] .sidebar-login{background:#2c3d30;border-color:#506752;color:#d9ead0}
html[data-theme=dark] .auth-tabs button[aria-pressed=true],html[data-theme=dark] .game-mode-picker button[aria-pressed=true]{background:#365b42;color:#fff;border-color:#8bb27a}
html[data-theme=dark] .game-mode-picker button span{color:#c3d2c0}
html[data-theme=dark] .auth-dialog input,html[data-theme=dark] select,html[data-theme=dark] input:not([type=checkbox]):not([type=radio]),html[data-theme=dark] textarea{background:#18271e;color:#e3eadf;border-color:#526b54}
html[data-theme=dark] input::placeholder,html[data-theme=dark] textarea::placeholder{color:#94a990}
html[data-theme=dark] .auth-note,html[data-theme=dark] .auth-divider,html[data-theme=dark] #auth-detail{color:#acbdaf}
html[data-theme=dark] #auth-message{color:#edce90}
html[data-theme=dark] .info-tabs{background:#202e24}
html[data-theme=dark] .info-tabs button{background:transparent;color:#c5d7be}
html[data-theme=dark] .info-tabs button[aria-selected=true]{background:#395c43;color:#fff;box-shadow:none}
html[data-theme=dark] .appearance-options label{background:#2c3b2f;border-color:#506752}
html[data-theme=dark] .appearance-options label:has(input:checked){background:#365b42;border-color:#8bb27a}
html[data-theme=dark] .progress-cards article,html[data-theme=dark] .status,html[data-theme=dark] .explanation,html[data-theme=dark] .review-moment{background:#293a2d;border-color:#4d644e;color:#e3eadf}
html[data-theme=dark] .progress-cards span,html[data-theme=dark] .saved-game-row small,html[data-theme=dark] .game-legend,html[data-theme=dark] .puzzle-note{color:#b2c5ac}
html[data-theme=dark] .milestone,html[data-theme=dark] .game-turn.finished{background:#493e24;color:#f0d896;border-color:#82734a}
html[data-theme=dark] .game-turn{background:#304b36;color:#e4eddf;border-color:#5b7955}
html[data-theme=dark] .game-turn.in-check{background:#4b3826;color:#f5d2a0;border-color:#997451}
html[data-theme=dark] .game-coaching{background:#263e2d;border-color:#557954}
html[data-theme=dark] .game-coaching h3{color:#b4dba7}html[data-theme=dark] .game-coaching p{color:#d0e4c8}
html[data-theme=dark] .game-badge,html[data-theme=dark] .dot-progress,html[data-theme=dark] .teacher-tip,html[data-theme=dark] .account-notice{background:#304a35;color:#d7e9c9;border-color:#557954}
html[data-theme=dark] .dot-tool{background:#2b3b2e;color:#e3eadf;border-color:#506752}
html[data-theme=dark] .dot-tool.active{background:#395740;border-color:#8fbb7e}
html[data-theme=dark] .stage-card,html[data-theme=dark] .level-choice{background:#2c3c30;color:#e3eadf;border-color:#506752}
html[data-theme=dark] .stage-card.active,html[data-theme=dark] .level-choice.active{background:#365b42;border-color:#8bb27a}
html[data-theme=dark] .stage-card small,html[data-theme=dark] .stage-card span>span{color:#b2c5ac}
html[data-theme=dark] .puzzle-number.active{background:#397452;color:#fff;border-color:#8bb27a}
html[data-theme=dark] .puzzle-number.solved:not(.active),html[data-theme=dark] .puzzle-progress{background:#51452a;color:#f1d58e;border-color:#9a814c}
html[data-theme=dark] .move-head{color:#b2c5ac;border-color:#506752}
html[data-theme=dark] .move-row:nth-child(even){background:#304236}
html[data-theme=dark] .move-row span:first-child{color:#b2c5ac}
html[data-theme=dark] .home-card .card-link,html[data-theme=dark] .saved-tools,html[data-theme=dark] .saved-game-row,html[data-theme=dark] .help-faq details{border-color:#506752}
html[data-theme=dark] .steps .active{background:#365b42;color:#d6e8cc}
html[data-theme=dark] .piece-choice{background:#e5ebdc;color:#243e37;border-color:transparent}
html[data-theme=dark] .piece-choice.active{background:#bcd6ad;border-color:#8bb27a}
html[data-theme=dark] .promotion-choices button{background:#e5ebdc;color:#243e37}
html[data-theme=dark] .guide-row{color:#243e37}html[data-theme=dark] .guide-row p{color:#536e56}
html[data-theme=dark] .game-player.black-player{border:1px solid #647460}
html[data-theme=dark] .game-win-card{color:#243e37}
html[data-theme=dark] .check-result.success,html[data-theme=dark] .board-result.success{background:#2f5138;color:#d5edc8;border-color:#7eac70}
html[data-theme=dark] .check-result.retry,html[data-theme=dark] .board-result.retry,html[data-theme=dark] .why-button{background:#55402a;color:#f4d5a9;border-color:#997451}
html[data-theme=dark] .privacy-content a,html[data-theme=dark] .feedback-panel a,html[data-theme=dark] .help-trouble a,html[data-theme=dark] .footer-links a{color:#afe0a4}
@media(max-width:650px){.info-tabs{gap:4px;padding:5px;margin-bottom:16px}.info-tabs button{font-size:12px;padding:10px 7px}.appearance-panel{padding:18px;margin-bottom:16px}.appearance-options{gap:7px}.appearance-options label{padding:10px 7px;gap:6px;font-size:12px;min-height:68px}.appearance-options label:has(input:checked){padding:9px 6px}.appearance-options small{font-size:10px;line-height:1.4}}
html[data-theme=dark] #menu-toggle,html[data-theme=dark] #erase.active{background:#365b42;color:#e3eadf;border-color:#8bb27a}
html[data-theme=dark] .explanation p,html[data-theme=dark] .review-summary,html[data-theme=dark] .review-method{color:#c6d8bd}
html[data-theme=dark] .game-win-close{background:transparent!important;color:#243e37!important}
/* Game setup and clocks: preserve the existing Light theme and board. */
.game-side{min-width:0;display:flex;flex-direction:column;gap:14px}.game-side .game-tools{width:100%;max-width:none}.game-running-tools .wide{margin-top:10px}.game-running-tools>details>summary{display:list-item;padding:10px 0;cursor:pointer}.game-side .field select{width:100%;font-size:16px}.game-side .panel-content{display:block}.game-clock{font-variant-numeric:tabular-nums;white-space:nowrap;padding:5px 9px;border-radius:8px;background:#ffffff26;font-size:19px;font-weight:800;margin-left:auto}.white-player .game-clock{background:#e1e9df;color:#25372c}.game-clock.clock-active{outline:2px solid #80b996}.game-clock.low-time{background:#ffe2d8;color:#952c20}.game-player{height:auto!important;min-height:46px!important;gap:7px}.captured-pieces{flex:1;min-width:0}.game-player strong{max-width:52%}#game-setup-summary{font-weight:700;line-height:1.6}.game-side #game-play{margin-top:16px}.game-tools>summary{display:list-item;cursor:pointer}.game-side .game-tools h2{display:block}
@media(max-width:980px){.game-side{order:1;width:100%;max-width:600px;align-self:center}body[data-game-setup=true] .game-side{order:-1}.game-side .game-tools{align-self:stretch}.game-clock{font-size:17px}.game-side .panel-content{display:block}.game-side .game-tools .wide{font-size:14px}}
html[data-theme=dark] .white-player .game-clock{background:#e1e9df;color:#25372c}

/* Compact game controls stay before the board on phones. */
.game-mode-picker button[aria-pressed="false"],html[data-theme=dark] .game-mode-picker button[aria-pressed="false"]{background:#fff;color:#26392e;border-color:#dfdacb;box-shadow:none}
html[data-theme=dark] .game-mode-picker button[aria-pressed="false"] span{color:#526255}
.game-controls>summary{display:list-item;cursor:pointer;padding:12px 0;font-weight:700;min-height:44px}
.game-controls>summary span{display:block;font-size:11px;font-weight:400;color:var(--muted);margin:4px 0 0 15px}
.game-controls-content{padding-top:5px}.game-controls-content>details>summary{display:list-item;cursor:pointer;padding:12px 0;font-weight:600;min-height:44px}
.game-controls-content>details>.panel-content{padding-top:8px}.game-running-tools>#game-new{margin-top:0}
@media(max-width:980px){
 .game-side,body[data-game-setup=true] .game-side{order:-1}
 .game-running-tools{padding:12px 16px}
 #game-setup-summary{margin:0 0 9px;font-size:12px}
 .game-running-tools>#game-new{width:100%;min-height:44px;font-size:13px}
 .game-controls>summary{padding-bottom:0}
 .game-controls-content .game-coordinates{min-height:44px;margin:8px 0;font-size:13px}
 .game-controls-content .field{margin:10px 0}
 .game-controls-content .wide{min-height:44px}
}
/* Learn: watch, try, discover. */
.learn-tabs{max-width:760px}.learn-piece-picker{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:16px}.learn-piece-picker button{background:#fff;border:2px solid var(--line);padding:12px 6px;min-width:0}.learn-piece-picker button[aria-pressed=true]{background:#e3eddc;border-color:#547551}.learn-piece-picker svg{width:48px;height:55px;margin:auto}.learn-piece-picker b,.learn-piece-picker small{display:block}.learn-piece-picker small{font-size:10px;font-weight:400;line-height:1.4;margin-top:5px;color:var(--muted)}.learn-demo-choices{display:flex;gap:18px;margin-bottom:18px;padding:12px 20px}.learn-demo-choices .field{flex:1;margin:0;max-width:400px}.learn-activity{padding:24px}.learn-memory{border-left:3px solid #d9b15d;padding:9px 13px;background:#fbf6e6;border-radius:0 10px 10px 0;font-size:13px}.learn-phases{display:flex;gap:8px;margin:20px 0;flex-wrap:wrap}.learn-phases button{min-height:44px;font-size:13px}.learn-phases button[aria-pressed=true]{background:var(--green);color:#fff}.learn-activity-layout{display:grid;grid-template-columns:minmax(260px,490px) minmax(210px,1fr);gap:24px;align-items:start}.learn-demo-shell{background:#fff;border:1px solid var(--line);border-radius:16px;padding:9px;min-width:0}.learn-board-wrap{position:relative;isolation:isolate}.learn-board{border-width:4px}.learn-board .sq{min-height:0}.learn-board .sq:focus-visible{outline-offset:-4px;z-index:5}.learn-board .coord{font-size:clamp(8px,1vw,11px)}.learn-side{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:10px;border-radius:8px;font-size:11px}.learn-side b{font-size:10px;letter-spacing:1px}.learn-black{background:#23352d;color:white;margin-bottom:7px}.learn-white{background:#fff9e8;border:1px solid #dbd3b6;color:#3f4d37;margin-top:7px}.learn-task{font-weight:bold;font-size:16px;color:var(--ink);margin-top:0}.learn-feedback{min-height:68px;background:#edf2e8;padding:12px;border-radius:12px;font-size:14px;color:#36543b}.learn-success{background:#e2f1df;color:#245a35}.learn-try-again{background:#fff0db;color:#83551e}.learn-buttons{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.learn-buttons button{min-height:44px;font-size:13px}.learn-instructions>.text-button{margin-top:18px;min-height:44px;text-align:left;font-size:13px}.learn-selected{box-shadow:inset 0 0 0 4px #305d91}.learn-target:after{content:'';position:absolute;inset:4px;border:3px dashed #285b78;border-radius:8px;pointer-events:none}.learn-travelling{z-index:8;overflow:visible}.learn-travelling .piece{z-index:9}.learn-party{position:absolute;inset:0;z-index:12;overflow:hidden;pointer-events:none}.learn-continue-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.learn-continue-bar h2{font-size:21px}.learn-continue-bar button{min-height:44px}.learn-library{margin-bottom:20px}.learn-library>summary{cursor:pointer;font-weight:bold;min-height:32px}.learn-library>summary span{font-size:12px;font-weight:400;color:var(--muted);margin-left:8px}.learn-lesson-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.learn-lesson-list button{display:flex;align-items:center;gap:12px;text-align:left;background:#f4f6ef;border:2px solid transparent;min-height:68px;padding:10px 12px}.learn-lesson-list button[aria-pressed=true]{border-color:#547551;background:#e3eddc}.learn-lesson-list small{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:5px}.learn-lesson-number{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border-radius:50%;background:#fff;color:#326d52}
html[data-theme=dark] .learn-piece-picker button{background:#243228;border-color:#405145}html[data-theme=dark] .learn-piece-picker button[aria-pressed=true],html[data-theme=dark] .learn-lesson-list button[aria-pressed=true]{background:#365b42;border-color:#8bb27a}html[data-theme=dark] .learn-memory{background:#3a3829;color:#f2e6c5}html[data-theme=dark] .learn-demo-shell{background:#243228;border-color:#405145}html[data-theme=dark] .learn-feedback{background:#314537;color:#d5e7ca}html[data-theme=dark] .learn-success{background:#34573e;color:#e0f0cf}html[data-theme=dark] .learn-try-again{background:#4f3e2a;color:#ffe2b2}html[data-theme=dark] .learn-phases button[aria-pressed=true]{background:#42664c;color:white}html[data-theme=dark] .learn-lesson-list button{background:#2d3c30}html[data-theme=dark] .learn-lesson-number{background:#dce8ce;color:#294b35}
@media(max-width:980px){.learn-activity-layout{grid-template-columns:minmax(0,1fr)}.learn-demo-shell{width:100%;max-width:520px;margin:auto}.learn-instructions{order:-1}.learn-task{font-size:14px}.learn-feedback{min-height:46px;padding:10px}.learn-activity-heading p{font-size:13px}.learn-instructions>.text-button{margin-top:4px}.learn-instructions>.small{margin:0;font-size:11px}.learn-activity{padding:16px}.learn-activity-layout{gap:16px}}
@media(max-width:650px){.learn-piece-picker{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.learn-piece-picker button{padding:8px 4px}.learn-piece-picker svg{width:35px;height:40px}.learn-piece-picker b{font-size:13px}.learn-piece-picker small{font-size:9px}.learn-demo-choices{flex-direction:column;padding:14px;gap:12px}.learn-demo-choices select{font-size:16px}.learn-activity h2{font-size:22px}.learn-phases{gap:5px;margin:14px 0}.learn-phases button{flex:1;padding:9px 5px;font-size:11px}.learn-continue-bar{display:block}.learn-continue-bar button{width:100%;margin-top:9px}.learn-lesson-list{grid-template-columns:1fr}.learn-lesson-list button{min-height:60px}.learn-side{font-size:10px;padding:8px}.learn-side b{font-size:9px}.learn-library{padding:16px}}
@media(prefers-reduced-motion:reduce){.learn-party{display:none}}
/* Version 27: calmer typography and a sidebar that fits everyday screens. */
body{font-size:15px}main{padding:22px 24px}h1{font-size:32px;line-height:1.15;margin:7px 0}h2{font-size:22px}p{line-height:1.5}.intro{margin-bottom:20px}.intro>div>p{font-size:14px}.panel{padding:20px}.home-page{padding:14px 0}.home-intro{margin-bottom:26px}.home-intro h1{font-size:clamp(34px,4vw,48px);letter-spacing:-1.6px;margin:12px 0}.home-intro p{font-size:14px;line-height:1.5}.home-cards{gap:16px}.home-card{padding:22px}.home-card h2{font-size:25px}.home-card .card-link{padding-top:14px;margin-top:12px}.info-tabs{margin-bottom:16px}
.app-sidebar{padding:16px 14px;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;overscroll-behavior:contain}.app-sidebar::-webkit-scrollbar{display:none}.sidebar-top{flex-shrink:0;margin-bottom:16px}.sidebar-caption{display:none}.app-sidebar .classroom-modes{gap:3px}.app-sidebar .nav-item{min-height:44px;font-size:13px;padding:9px 10px;gap:10px}.app-sidebar .nav-icon{font-size:19px}.app-sidebar #help-mode{margin-top:7px;padding-top:10px}.sidebar-account{flex-shrink:0;padding:12px 4px 0;margin-top:auto}.sidebar-account>.eyebrow,.sidebar-account>p:not(#account-status){display:none}.account-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:0}.account-actions a{min-height:42px;padding:11px 6px;font-size:12px}.account-actions #account-signout{grid-column:1/-1}.sidebar-account #account-status{font-size:11px;line-height:1.4;margin:7px 0 0}.sidebar-footnote{display:none}
.learn-activity{padding:20px}.learn-activity-heading h2{font-size:23px;margin:6px 0}.learn-activity-heading p{font-size:14px}.learn-memory{padding:7px 10px;margin-top:7px}.learn-phases{margin:14px 0}.learn-demo-choices{padding:12px 16px;margin-bottom:14px}.learn-piece-picker{gap:8px;margin-bottom:12px}.learn-piece-picker button{padding:9px 5px}.learn-piece-picker svg{width:40px;height:46px}.learn-task{font-size:15px}.learn-feedback{min-height:48px;padding:10px}.learn-buttons{margin:9px 0}.learn-instructions>.text-button{margin-top:8px}.learn-activity-layout{gap:18px}.learn-continue-bar{padding:16px 18px;margin-bottom:12px}.learn-library{padding:16px 18px;margin-bottom:16px}.learn-lesson-list button{min-height:60px}.learn-demo-shell{max-width:460px}.learn-board .sq{padding:0;min-height:0}
@media(min-width:981px) and (max-height:720px){.app-sidebar{padding:12px}.sidebar-top{margin-bottom:10px}.app-sidebar .nav-item{min-height:38px;padding:7px 10px}.app-sidebar #help-mode{margin-top:4px;padding-top:8px}.sidebar-account{padding-top:8px}.app-sidebar .brand{font-size:20px}.app-sidebar #brand-icon{width:32px;height:36px}}
@media(min-width:981px) and (min-height:850px){.sidebar-footnote{display:block;margin:12px 4px 0;font-size:10px;line-height:1.4}}
@media(max-width:980px){
 main{padding:16px 14px}h1{font-size:28px}.intro{margin-bottom:15px}.intro>div>p{font-size:13px}.panel{padding:16px}.mobile-header{min-height:54px;padding:7px 14px}.mobile-brand{font-size:18px}.mobile-brand img{width:28px;height:28px}
 .app-sidebar{padding:16px 14px}.app-sidebar .nav-item{min-height:44px}.sidebar-account{padding-top:12px}.account-actions a{min-height:44px}.app-sidebar .sidebar-top{margin-bottom:12px}.sidebar-footnote{display:none}
 .home-page{padding:4px 0}.home-intro{margin-bottom:18px}.home-intro h1{font-size:34px;margin:9px 0}.home-intro p{font-size:13px}.home-card{min-height:140px;padding:16px}.home-card h2{font-size:22px}.home-card .card-link{padding-top:0;margin-top:8px}.home-card p{font-size:12px}.home-footnote{margin-top:14px}
 .learn-activity{padding:14px}.learn-activity-heading h2{font-size:21px}.learn-activity-heading p{font-size:13px}.learn-task{font-size:14px}.learn-activity-layout{gap:12px}.learn-feedback{min-height:42px;padding:8px 10px}.learn-demo-shell{max-width:430px}.learn-continue-bar{padding:14px}.learn-library{padding:14px}.learn-instructions>.text-button{margin-top:0}
 .game-running-tools{padding:12px 16px}.game-side .game-tools{padding:16px}.tools{padding:14px 16px}
}
@media(max-width:650px){
 .learn-piece-picker{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}.learn-piece-picker button{padding:7px 2px;min-height:68px}.learn-piece-picker svg{width:29px;height:34px}.learn-piece-picker b{font-size:11px}.learn-piece-picker small{display:none}
 .learn-demo-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}.learn-demo-choices .field{min-width:0;max-width:none}.learn-demo-choices .field:last-child{grid-column:1/-1}.learn-demo-choices:has(#learn-pawn-colour-field:not([hidden])) .field:last-child{grid-column:auto}.learn-demo-choices label{font-size:11px;line-height:1.4}.learn-demo-choices select{font-size:16px;padding:9px 6px;min-height:44px}
 .learn-phases{margin:11px 0}.learn-memory{font-size:12px}.learn-buttons{gap:6px;margin:7px 0}.learn-buttons button{padding:10px;font-size:12px}.learn-continue-bar h2{font-size:20px}.learn-continue-bar button{margin-top:7px}.learn-library{margin-bottom:12px}.learn-library>summary{min-height:44px}.learn-side{padding:7px}.learn-lesson-list button{min-height:56px}
 .home-intro h1{font-size:32px}h1{font-size:26px}.learn-tabs button{font-size:12px}.learn-activity .learn-board .coord{font-size:9px}
}
/* Version 28: a slimmer desktop navigation pane. */
@media(min-width:981px){
 :root{--sidebar-width:196px}
 .app-sidebar{padding-left:10px;padding-right:10px}
 .app-sidebar .brand{font-size:20px;gap:7px}
 .app-sidebar #brand-icon{width:32px;height:36px}
 .app-sidebar .brand small{font-size:7px;letter-spacing:.8px}
 .app-sidebar .nav-item{gap:8px;padding-left:9px;padding-right:7px}
 .app-sidebar .nav-icon{width:20px;flex-shrink:0}
 .sidebar-account{padding-left:2px;padding-right:2px}
}
/* Version 29: stacked account buttons and a narrower desktop sidebar. */
.app-sidebar .account-actions{display:flex;flex-direction:column;gap:7px}
.app-sidebar .account-actions a{width:100%;min-height:44px}
@media(min-width:981px){:root{--sidebar-width:180px}.app-sidebar .nav-item{gap:6px;padding-left:7px;padding-right:5px}.app-sidebar .nav-icon{width:18px}}
/* Persistent movement choices belong to the original starting square. */
.learn-choice-arrows{position:absolute;inset:4px;width:calc(100% - 8px);height:calc(100% - 8px);z-index:3;pointer-events:none;overflow:visible}.learn-choice-arrow{fill:none;stroke:#276688;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;opacity:.88}.learn-arrow-head{fill:#276688}.learn-capture-arrow{stroke:#a25327}.learn-capture-head{fill:#a25327}.learn-board .piece{position:relative;z-index:4}.learn-board .pawn-arrow{z-index:5}.learn-landing-dot{position:absolute;width:23%;height:23%;border-radius:50%;background:#236c61;box-shadow:0 0 0 2px #fff8;z-index:2;pointer-events:none;animation:learn-dot-pop .25s ease-out}.learn-capture-ring{width:78%;height:78%;background:transparent;border:3px solid #a25327;box-shadow:0 0 0 2px #fff7;z-index:5}.learn-choice-origin{outline:3px dashed #315e86;outline-offset:-5px}.learn-origin-ghost{opacity:.22;filter:none!important}.learn-blocker{box-shadow:inset 0 0 0 3px #a66e30}.learn-stop-tag{position:absolute;right:2px;top:2px;background:#fff0ce;color:#784b1d;border-radius:4px;padding:2px 3px;z-index:6;font-size:9px;font-weight:bold;pointer-events:none}.learn-choice-key{font-size:11px;color:var(--muted);margin:0 0 8px;line-height:1.5}.learn-board .learn-travelling,.learn-board .learn-travelling .piece{z-index:8}.learn-board .coord{z-index:6}.learn-board .learn-choice-origin:focus-visible{outline-style:solid}
@keyframes learn-dot-pop{from{transform:scale(.25);opacity:0}to{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.learn-landing-dot{animation:none}}
/* Green ticks distinguish available destinations from the board artwork. */
.learn-landing-dot{width:29%;height:29%;display:grid;place-items:center;background:#278353;z-index:5}
.learn-check-glyph{color:#fff;font-size:clamp(11px,1.6vw,18px);font-weight:900;line-height:1}
.learn-landing-dot.learn-capture-ring{width:78%;height:78%;background:transparent;display:block}
.learn-capture-ring .learn-check-glyph{position:absolute;right:-4px;bottom:-4px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#278353;border:1px solid #fff;font-size:15px}
#learn-pawn-stage-field select{font-size:16px}
@media(max-width:650px){.learn-demo-choices:has(#learn-pawn-stage-field:not([hidden])) .field:last-child{grid-column:1/-1}.learn-check-glyph{font-size:12px}.learn-capture-ring .learn-check-glyph{width:17px;height:17px;font-size:12px}}

/* v32: shared board appearance. Original colours remain the default. */
.board{border-color:var(--board-edge,#728664)}
.board .sq,.style-preview-square{background-color:var(--board-light,#f0edd7)}
.board .sq.dark,.style-preview-square.dark{background-color:var(--board-dark,#98ad85)}
html[data-board-style]:not([data-board-style=default]) .board .coord{color:#203039;text-shadow:0 1px 1px #fffc}
.board-style-settings{margin:12px 0;border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--cream)}
.board-style-settings>summary{cursor:pointer;font-size:13px;font-weight:bold;min-height:28px}
.board-style-settings>summary span{font-size:11px;font-weight:normal;color:var(--muted);margin-left:6px}
.board-style-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}
.board-style-fields label{display:block;font-size:12px;font-weight:bold;margin-bottom:6px}
.board-style-fields select{font-size:12px;min-height:44px;padding:8px;width:100%}
.board-style-preview{display:grid;grid-template-columns:repeat(4,1fr);width:176px;max-width:100%;border:3px solid var(--board-edge,#728664);border-radius:7px;overflow:hidden}
.style-preview-square{aspect-ratio:1;display:grid;place-items:center}
.style-preview-square svg{width:84%;height:84%}
@media(max-width:380px){.board-style-fields{grid-template-columns:1fr}}
/* Keep last-move information above the chosen board palette. */
.board .sq.last-move{background-color:#eddd86}
.board .sq.last-move.dark{background-color:#b6b56c}

/* v33: one Settings page for all modes. */
.settings-board-panel,.playing-aids-panel{margin-bottom:18px}
.settings-board-panel .board-style-fields{max-width:540px}
.playing-aids-panel .game-coordinates{display:flex;align-items:center;gap:10px;min-height:44px;margin:4px 0;font-size:14px}
.playing-aids-panel input{width:18px;height:18px;flex-shrink:0}
.game-settings-link,.learn-settings-link a,.board-options a{display:inline-block;color:var(--green);font-size:12px;line-height:1.6;padding:8px 0}
html[data-square-names=false] .board .coord{display:none}
html[data-last-move=false] .learn-board .sq.last-move{background-color:var(--board-light,#f0edd7)}
html[data-last-move=false] .learn-board .sq.last-move.dark{background-color:var(--board-dark,#98ad85)}

.settings-tabs{max-width:850px}.settings-board-panel,.playing-aids-panel{max-width:850px}

/* Memory Game: stable board layout, timers update without rebuilding the page. */
.learn-tabs{max-width:850px}.memory-page{max-width:850px}.memory-setup{max-width:760px;margin:auto}.memory-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:22px 0 12px}.memory-presets button{padding:14px 8px;border:2px solid var(--line);background:#fff;min-width:0}.memory-presets button b,.memory-presets button span{display:block}.memory-presets button b{font-size:14px}.memory-presets button span{font-size:11px;font-weight:normal;margin-top:6px}.memory-presets button[aria-pressed=true]{border-color:var(--green);background:#e5eddd}.memory-sliders{display:grid;gap:24px;margin:24px 0}.memory-sliders label{display:flex;justify-content:space-between;gap:12px;font-size:14px;font-weight:bold}.memory-sliders output{color:var(--green);white-space:nowrap}.memory-sliders input{width:100%;min-height:36px;cursor:pointer}.memory-range-ends{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.memory-round{max-width:580px;margin:auto}.memory-round-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.memory-round-header h2{font-size:25px;margin:5px 0}.memory-timer{min-width:85px;border:1px solid var(--line);border-radius:12px;padding:8px 12px;text-align:center;background:#fff}.memory-timer span{display:block;font-size:11px;color:var(--muted)}.memory-timer b{font-size:24px;font-variant-numeric:tabular-nums}#memory-progress{display:block;width:100%;height:12px;border:0;border-radius:8px;overflow:hidden;accent-color:var(--green);margin:10px 0}#memory-progress::-webkit-progress-bar{background:#dde5d7}#memory-progress::-webkit-progress-value{background:var(--green)}#memory-progress::-moz-progress-bar{background:var(--green)}.memory-phase-status{font-size:13px;min-height:42px;margin:10px 0}.memory-board-shell{position:relative;isolation:isolate;overflow:hidden}.memory-board-shell .sq:disabled{opacity:1;cursor:default}.memory-board-shell .sq:focus-visible{outline-offset:-4px;z-index:3}.memory-palette{margin:14px 0}.memory-piece-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-bottom:10px}.memory-piece-label{grid-column:1/-1;font-size:10px;letter-spacing:1.5px;color:var(--muted)}.memory-piece-row button{padding:5px 2px;border:2px solid transparent;min-width:0;background:#fff}.memory-piece-row button svg{height:42px;width:42px;max-width:100%;margin:auto}.memory-piece-row small{display:block;font-size:10px;font-weight:normal}.memory-piece-row button[aria-pressed=true]{border-color:var(--green);background:#e5eddd}.memory-piece-row button:disabled{opacity:.55}.memory-actions{display:flex;gap:10px;margin:14px 0}.memory-actions button{flex:1;min-height:44px}.memory-results{margin-top:16px}.memory-results h3{font-size:21px;line-height:1.4}.memory-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:18px 0}.memory-stats div{padding:10px 4px;background:var(--cream);border-radius:10px;text-align:center}.memory-stats b{display:block;font-size:21px}.memory-stats span{display:block;font-size:10px;color:var(--muted);margin-top:5px}.memory-results details{margin:14px 0;font-size:13px}.memory-results summary{cursor:pointer;font-weight:bold}.memory-results li{margin:8px 0;line-height:1.5}.memory-square-result{position:absolute;right:3px;bottom:3px;background:#25704a;color:white;border:1px solid white;border-radius:50%;width:20px;height:20px;display:grid;place-items:center;z-index:4;font-size:13px}.memory-wrong .memory-square-result,.memory-extra .memory-square-result{background:#ae4c32}.memory-missing .memory-square-result{background:#94641f}.memory-correct{box-shadow:inset 0 0 0 3px #25704a}.memory-wrong,.memory-extra{box-shadow:inset 0 0 0 3px #ae4c32}.memory-missing{box-shadow:inset 0 0 0 3px #ac7f35}.memory-expected{position:absolute;width:78%;height:86%;opacity:.4;pointer-events:none}.memory-expected-small{width:38%;height:42%;top:0;right:0;opacity:.8;background:#fff9;border-radius:5px}.memory-page a{color:var(--green)}
html[data-theme=dark] .memory-presets button,html[data-theme=dark] .memory-piece-row button,html[data-theme=dark] .memory-timer{background:#283c30;color:var(--ink)}html[data-theme=dark] .memory-presets button[aria-pressed=true],html[data-theme=dark] .memory-piece-row button[aria-pressed=true]{background:#3c5840;border-color:#9bc08b}
@media(max-width:650px){.learn-tabs{flex-wrap:wrap}.learn-tabs button{flex:1 1 calc(50% - 8px)}.memory-presets{grid-template-columns:repeat(2,minmax(0,1fr))}.memory-round-header h2{font-size:21px}.memory-timer{padding:6px 8px;min-width:75px}.memory-board-shell{padding:6px}.memory-piece-row{gap:4px}.memory-piece-row button svg{height:35px;width:35px}.memory-piece-row small{font-size:9px}.memory-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.memory-square-result{width:16px;height:16px;font-size:10px}.memory-phase-status{min-height:42px}.memory-sliders label{font-size:13px}}