:root{color-scheme:light;--ink:#63464d;--muted:#81676b;--rose:#d85877;--line:#ecd4d7;--paper:#fffdf8;--mint:#d85877;font-family:'Hiragino Maru Gothic ProN','Hiragino Kaku Gothic ProN','Yu Gothic',system-ui,sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 0%,#ffe2e4,transparent 55%),radial-gradient(ellipse at 100% 90%,#e9f3e5,transparent 55%),#fff7ed;color:var(--ink);min-height:100dvh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;border:1px solid var(--line);background:var(--paper);border-radius:16px;min-height:44px}button:focus-visible,a:focus-visible{outline:3px solid #a33154;outline-offset:3px}button:active:not(:disabled):not(.cell){filter:brightness(.96)}button:disabled{cursor:default}main{max-width:480px;margin:auto;padding:12px 16px max(18px,env(safe-area-inset-bottom))}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}header button{width:44px;font-size:22px;box-shadow:0 3px 0 #edcbd1}.wordmark{text-align:center;font-size:26px;letter-spacing:.02em;font-weight:900}.wordmark span{color:var(--rose)}.wordmark small{display:block;font-size:12px;font-weight:600;letter-spacing:.1em;color:var(--muted);margin-top:2px}.journey-strip{padding:12px 16px;background:#fffdf7bb;border:1px solid #f0dbd5;border-radius:18px}.journey-strip>div:first-child{display:flex;justify-content:space-between;gap:12px;font-size:14px}#journeyMeter{margin-top:8px;height:7px;background:#f2e0df;overflow:hidden;border-radius:9px}#journeyMeter i{display:block;height:100%;border-radius:9px;background:#e8869d;transition:width .3s}.stage-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:16px 0 12px}.stage-title p{margin:0 0 5px;font-size:12px;font-weight:800;letter-spacing:.07em;color:#a14f66}h1{font-size:21px;margin:0;line-height:1.45}.stage-title button{flex-shrink:0;padding:0 12px;font-size:14px}.dashboard{display:flex;background:var(--paper);border:2px solid #fff;border-radius:22px;box-shadow:0 4px 0 #edd5d3;min-height:83px;overflow:hidden}.moves{width:90px;flex-shrink:0;text-align:center;padding:11px 7px;background:#ffe2e5}.moves span,.goals>span{display:block;font-size:12px;font-weight:700}.moves b{display:block;font-size:32px;line-height:1.2;color:#a84260}.moves b.low{color:#b2362f}.goals{flex:1;min-width:0;padding:10px 12px}.goals>span{color:var(--muted);margin-bottom:3px}#goals{display:flex;flex-wrap:wrap;gap:3px 9px}.goal{display:flex;align-items:center;gap:2px;font-weight:800;font-size:18px}.goal.done{color:#34704d}.mini{width:27px;height:27px;display:inline-block;flex-shrink:0;font-style:normal}.gem,.mini:not(.glass):not(.box-mini):not(.key),.mascot{background-image:url('assets/property-pieces-cream6.png');background-size:var(--sprite-size);background-repeat:no-repeat}.c0{--sprite-size:385.65217391% 206.27906977%;background-position:1.52207002% 5.47045952%}.c1{--sprite-size:403.18181818% 206.27906977%;background-position:34.48275862% 5.47045952%}.c2{--sprite-size:403.18181818% 206.27906977%;background-position:66.19190405% 5.47045952%}.c3{--sprite-size:394.22222222% 206.27906977%;background-position:98.18731118% 5.47045952%}.c4{--sprite-size:394.22222222% 206.27906977%;background-position:2.26586103% 100.00000000%}.mini.glass{border:2px solid #72b7cb;border-radius:6px;background:#d9f5ff}.mini.box-mini{border:2px solid #b4865c;border-radius:5px;background:#e4c7a3;text-align:center;line-height:23px}.mini.key{font-size:23px;background:none;line-height:27px}.lesson-requirement{font-size:12px;text-align:center;margin:10px 0;color:#8d5b64}#instruction{font-size:14px;line-height:1.6;text-align:center;margin:9px 0}.playfield{position:relative;padding:7px;border:3px solid #fff8f2;border-radius:24px;background:#e9c8c7;box-shadow:0 5px 0 #d4aaad,0 12px 24px #986f7114;isolation:isolate}#board{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;touch-action:none}.cell{position:relative;aspect-ratio:1;min-height:0;min-width:0;border:0;border-radius:11px;padding:0;background:#fff9f285;transition:transform .16s;z-index:1;overflow:visible;user-select:none}.gem-motion{display:block;width:100%;height:100%}.gem{display:block;position:relative;width:100%;height:100%}.cell.glass{background:#cbf1f5;border:2px solid #73bbcd;box-shadow:inset 0 0 0 2px #f5ffff}.cell.double{border-color:#458eae;box-shadow:inset 0 0 0 3px #99d4e6}.cell.selected{outline:3px solid #b53e61;outline-offset:0;z-index:3;background:#fff}.cell.hinted{animation:hint 1s ease-in-out infinite}.cell.special{background:#fff5d9}.cell.bomb .gem{--sprite-size:394.22222222% 206.27906977%;background-position:33.61027190% 100.00000000%}.cell.horizontal .gem{--sprite-size:394.22222222% 206.27906977%;background-position:66.84290030% 100.00000000%}.cell.vertical .gem{--sprite-size:394.22222222% 206.27906977%;background-position:98.94259819% 100.00000000%}.gem.key{background:none;display:grid;place-items:center;font-size:clamp(24px,7vw,36px)}.gem.crate-gem{background:#ddb78a;border:3px solid #ad7d51;border-radius:8px;display:grid;place-items:center;color:#9b6947;font-size:30px;box-shadow:inset 0 0 0 2px #efd6b5}.layer-count{position:absolute;bottom:0;right:0;min-width:17px;height:17px;line-height:17px;background:#805132;color:white;border-radius:6px;font-size:12px;font-weight:800}.ice-count{background:#347f99}.cell.drop .gem-motion{animation:drop .22s ease-out}.cell.pop .gem-motion{animation:pop .23s ease-in forwards}.cell.shake{animation:shake .2s}.cell.new-special .gem-motion{animation:grow .3s}#fx{position:absolute;inset:7px;pointer-events:none;overflow:hidden;border-radius:16px;z-index:5}.spark{position:absolute;width:7px;height:7px;background:#ffe071;border-radius:50%;box-shadow:0 0 0 2px #fff4d5;animation:spark .48s ease-out forwards}.spark:nth-child(3n){background:#ed84a7}.beam{position:absolute;background:#fff5ba;box-shadow:0 0 15px #ffb942;animation:beam .32s ease-out forwards}#cheer{position:absolute;inset:35% 0 auto;text-align:center;font-size:clamp(24px,7vw,34px);font-weight:900;color:#b14764;text-shadow:2px 2px #fff,-2px -2px #fff,2px -2px #fff,-2px 2px #fff;pointer-events:none;z-index:6;opacity:0}#cheer.show{animation:cheer .8s ease-out}.meter{display:flex;justify-content:space-between;gap:8px;margin:12px 2px 0;font-size:12px;color:var(--muted)}#score{font-weight:800}#message{font-size:14px;line-height:1.6;min-height:2.8em;margin:10px 2px;color:#75575d}nav{display:flex;gap:7px}nav button{flex:1;font-size:14px;padding:8px 5px;border-radius:14px;box-shadow:0 3px 0 #ecd4d7;white-space:nowrap}.footnote{text-align:center;font-size:12px;color:#876e70;line-height:1.8;margin:17px 0 0}dialog{color:var(--ink);width:calc(100% - 28px);max-width:450px;max-height:calc(100dvh - 40px);background:#fffdf7;border:3px solid #fff;border-radius:28px;padding:24px;box-shadow:0 12px 50px #704b5e33;overflow:auto}dialog::backdrop{background:#73546573}dialog h2{font-size:24px;line-height:1.5;margin:6px 0 15px}dialog p{font-size:16px;line-height:1.8;margin:12px 0}.eyebrow{font-size:12px!important;font-weight:800;color:#a34561;letter-spacing:.08em}.primary,.secondary{width:100%;padding:14px 16px;margin:6px 0;line-height:1.5;font-weight:800;min-height:52px}.primary{color:#fff;background:#cf506f;border:1px solid #bd4765;box-shadow:0 4px 0 #a63b58}.secondary{background:#fff9f0;box-shadow:0 2px 0 #ecd4d7;font-size:14px}.learn-note{font-size:12px!important;line-height:1.8;color:var(--muted)}.mascot{width:105px;height:105px;margin:0 auto 6px}.stars{color:#b77919;font-size:34px;letter-spacing:.12em;margin:10px 0}.badge{display:inline-block;border-radius:12px;padding:8px 12px;background:#fff0cf;font-size:14px;font-weight:700}.step{display:flex;gap:12px;line-height:1.7;margin:16px 0}.step b{display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;border-radius:50%;background:#ffe1e9;color:#aa4160}.stage-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px 7px;margin:20px 0}.map-stage{padding:7px 2px;border-radius:18px;min-height:64px;background:#fff6e7;box-shadow:0 3px 0 #ead4ca}.map-stage b{display:block;font-size:21px}.map-stage small{display:block;font-size:12px;margin-top:2px}.map-stage:disabled{background:#f2eae4;border-color:#e3d5cc;color:#9b8580;box-shadow:none}.map-stage.done{background:#fff1c5;border-color:#e2bf79}.map-stage.done small{color:#946414}.map-stage.current{background:#dd6b88;color:#fff;border-color:#ba4968;box-shadow:0 3px 0 #aa3c5a}.map-stage.milestone{border-width:2px}.map-summary{font-size:14px!important}.lesson-progress{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;background:#fff0db;padding:12px;border-radius:14px;font-size:14px}.question{font-weight:700;line-height:1.85!important}#learnOptions{display:grid;gap:9px;margin:20px 0}.learn-option{display:flex;align-items:flex-start;gap:10px;text-align:left;padding:13px 12px;line-height:1.7;background:#fff;border:2px solid #e7d4d6;border-radius:16px}.option-number{flex:0 0 25px;width:25px;line-height:25px;text-align:center;border-radius:50%;background:#f9e9ec;font-size:14px;font-weight:800;color:#986575}.learn-option.correct{border-color:#4e9366;background:#e6f5e9;color:#285c39}.learn-option.wrong{border-color:#d5757d;background:#fff0ee;color:#893e43}.learn-option:disabled{opacity:1}#learnFeedback{line-height:1.8}#learnFeedback strong{color:#41734e}#learnFeedback a,.learn-card a{color:#91536d;font-size:12px;overflow-wrap:anywhere}.notebook-group{border:1px solid #ead5d5;border-radius:17px;background:#fffaf2;margin:12px 0;padding:14px}.notebook-group summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;font-weight:800;font-size:14px}.learn-card{padding:12px 0;border-bottom:1px solid #f0dfdb}.learn-card:last-child{border:0}.learn-card h3{font-size:16px;margin:5px 0}.learn-card p{font-size:14px;margin:5px 0}.learn-card small{display:block;font-size:12px;color:var(--muted)}.learn-card a{display:block;margin-top:5px}
@keyframes drop{from{transform:translateY(-70%);opacity:.3}to{transform:translateY(0);opacity:1}}@keyframes pop{50%{transform:scale(1.15)}to{transform:scale(.1);opacity:0}}@keyframes grow{50%{transform:scale(1.25)}}@keyframes hint{50%{box-shadow:0 0 0 3px #b34365;transform:scale(.94)}}@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes spark{to{transform:translate(var(--x),var(--y));opacity:0}}@keyframes beam{to{opacity:0;filter:blur(7px)}}@keyframes cheer{0%{opacity:0;transform:scale(.7)}20%,65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(-20px)}}
@media(max-width:360px){main{padding-left:10px;padding-right:10px}.stage-title{gap:5px}h1{font-size:19px}.playfield{padding:5px;border-radius:20px}.moves{width:76px}.goals{padding:10px 7px}#goals{gap:2px 5px}dialog{padding:19px}nav{gap:5px}nav button{font-size:12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.cell.pop .gem-motion{opacity:.2}#cheer.show{opacity:1}}

#audio{display:grid;place-items:center;flex-shrink:0}#audio svg{display:block;overflow:visible}
/* Focus is not a game selection. Hide browser focus rings for this pointer UI;
   retain .cell.selected so the first tapped puzzle piece remains identifiable. */
button:not(.selected):focus,button:not(.selected):focus-visible,a:focus,a:focus-visible,summary:focus,summary:focus-visible,dialog:focus,dialog:focus-visible{outline:none}
/* v6: approved cream layout A; one restrained accent throughout game and lesson. */
:root{--ink:#503b2c;--muted:#806e5d;--rose:#24636a;--line:#e7d8c5;--paper:#fffbf3;--mint:#24636a;font-family:'Hiragino Sans','Hiragino Kaku Gothic ProN','Yu Gothic',system-ui,sans-serif}body{background:#fff7eb;color:var(--ink)}main{padding:calc(12px + env(safe-area-inset-top)) 16px max(18px,env(safe-area-inset-bottom));max-width:460px}button{border-color:var(--line);border-radius:15px}button:focus-visible,a:focus-visible{outline-color:#24636a}header{margin-bottom:12px;gap:12px}header button{display:grid;place-items:center;flex-shrink:0;background:transparent;border:0;box-shadow:none;width:44px;height:44px;color:#775d45}.wordmark{font-size:25px;letter-spacing:.02em;color:#503723;font-weight:850}.stage-title{margin:0 0 16px;align-items:center}.stage-title h1{font-size:17px;font-weight:750;letter-spacing:.02em}.stage-title p{font-size:12px;font-weight:400;letter-spacing:0;color:var(--muted);margin:3px 0 0}.stage-title button{border:1px solid #dccab4;border-radius:50%;min-height:32px;width:32px;padding:0;background:transparent;font-size:17px;box-shadow:none}.dashboard{background:#fffbf4;border:1px solid #eedfca;border-radius:22px;box-shadow:0 4px 12px #8f633311;margin-bottom:18px;min-height:92px;align-items:stretch}.goals{padding:14px 16px}.goals>span{font-size:14px;color:#6c5039;font-weight:650;margin-bottom:5px}#goals{gap:5px 13px}.goal{font-size:24px;font-weight:700;gap:4px}.mini{width:34px;height:34px}.moves{background:transparent;width:103px;align-self:center;border-left:1px solid #ecdcc6;padding:4px 12px}.moves>span{font-size:14px;color:#6c5039;font-weight:650}.moves>div{display:flex;align-items:baseline;justify-content:center;gap:4px}.moves b{font-size:43px;color:#845544;font-weight:750;line-height:1.2}.moves small{font-size:14px}.moves b.low{color:#b44335}.playfield{padding:8px;border:1px solid #ebd6b9;border-radius:23px;background:#f4e5ce;box-shadow:inset 0 1px 4px #9e79441a,0 3px 0 #e9d7bc}#board{gap:4px}.cell{background:#fff9ef;border-radius:10px;box-shadow:0 2px 1px #af895026}.gem{transform:scale(.92);transform-origin:center}.cell.special{background:#fff9ef}.cell.selected{background:#fffdf5;outline:3px solid #24636a;outline-offset:0}.cell.glass{background:#def0f1}.cell.crate{background:#f5e2c6}.layer-count{right:1px;bottom:1px}.cell.hinted{animation:cream-hint 1s ease-in-out infinite}#cheer{color:#805337;font-size:27px;text-shadow:2px 2px #fff8e9,-2px -2px #fff8e9,2px -2px #fff8e9,-2px 2px #fff8e9}#message{font-size:14px;color:var(--muted);text-align:center;margin:10px 0 8px;min-height:1.5em;line-height:1.5}nav{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:8px}nav button{display:flex;align-items:center;justify-content:center;gap:8px;white-space:normal;box-shadow:none;font-size:15px;line-height:1.4;padding:10px 14px;flex:initial}#hint{width:174px;min-height:48px;background:#24636a;color:#fff;border-color:#1b535a;border-radius:19px;box-shadow:0 3px 0 #17454a;font-weight:700}.secondary-actions{display:flex;width:100%;max-width:330px;gap:12px}.secondary-actions button{flex:1;background:transparent;border-color:#deccb6;min-height:44px;color:#76573f;font-size:14px}nav svg{flex-shrink:0}#saveStatus{font-size:13px;line-height:1.6;text-align:center;color:#9b4438;margin:12px 0 0}#saveStatus:empty{display:none}dialog{background:#fffbf3;border:1px solid #eadbc7;padding:24px;border-radius:25px;box-shadow:0 12px 45px #49342230;max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));color:var(--ink)}dialog::backdrop{background:#46372c69}dialog h2{font-size:23px;line-height:1.5;letter-spacing:0;font-weight:750;margin:8px 0 16px}dialog p{line-height:1.8}.eyebrow{font-size:12px!important;color:#70604f;font-weight:700;letter-spacing:.06em}.primary{background:#24636a;border-color:#1c5359;box-shadow:0 3px 0 #153f44;color:#fff;border-radius:15px;font-size:16px;min-height:52px}.secondary{background:transparent;border-color:#dccaaf;box-shadow:none;color:#6e533b}.learn-note{color:#806e5d}.badge{background:#f2e7d4;color:#765336}.stars{color:#ba8a32}.step b{background:#e2eded;color:#24636a}.map-stage.current{background:#24636a;border-color:#1c5359;box-shadow:0 3px 0 #153f44}.map-stage.done{background:#f7eac9;border-color:#d9c198}.notebook-group{background:#fffcf7;border-color:#e6d7c3}.learn-card{border-color:#e9dfd0}.learn-card a{color:#24636a}.mascot{width:78px;height:78px}dialog[data-kind="clear"],dialog[data-kind="reward"],dialog[data-kind="welcome"]{text-align:center}
/* Lesson: compact progress, readable question, four distinct answer targets. */
dialog[data-kind="lesson"]{max-width:480px;padding:24px;scroll-padding-bottom:100px}.lesson-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.lesson-stage{font-size:12px;color:#806e5d}.lesson-progress{display:block;background:transparent;padding:14px 0 19px;margin-bottom:22px;border-bottom:1px solid #e6d7c3;border-radius:0}.lesson-progress>div:first-child{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}.lesson-progress b{font-size:16px;color:#345e5b;font-weight:750}.lesson-progress span{font-size:12px;color:#806e5d}.lesson-dots{display:flex;gap:6px;margin-top:12px}.lesson-dots i{height:5px;border-radius:3px;background:#e9dece;flex:1}.lesson-dots i.filled{background:#34736e}.question-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:12px;color:#73614d}.question-meta span{background:#f0e7d7;border-radius:6px;padding:4px 8px}.question-topic{font-size:13px!important;line-height:1.5!important;color:#88735d;margin:13px 0 5px!important}dialog h2.question{font-size:20px;line-height:1.85!important;font-weight:700;margin:0 0 20px;overflow-wrap:anywhere}.choice-instruction{font-size:12px!important;color:#806e5d;margin:0 0 8px!important}#learnOptions{gap:10px;margin:0 0 20px}.learn-option{background:#fffefb;border:1.5px solid #dac9b1;border-radius:14px;padding:14px 12px;min-height:58px;gap:11px;font-size:16px;line-height:1.7;box-shadow:0 2px 0 #e7dac630}.learn-option:not(:disabled):active{border-color:#24636a;background:#f1f7f3}.option-number{width:26px;flex-basis:26px;line-height:26px;background:#f0e8da;color:#7d6248;font-size:14px;margin-top:1px}.option-copy{min-width:0;overflow-wrap:anywhere}.answer-state{display:block;font-size:12px;font-weight:750;margin-top:4px}.learn-option.correct{border:2px solid #438370;background:#edf5ed;color:#275845}.learn-option.correct .option-number{background:#36735e;color:white}.learn-option.wrong{border:2px solid #b57956;background:#fff3e7;color:#7a4c30}.learn-option.wrong .option-number{background:#a56643;color:#fff}.learn-option.muted{color:#93826e;background:#faf6ed;border-color:#e9dfd0}.explanation{padding:18px;background:#f1ecdf;border-radius:16px;border:1px solid #e1d8c6;margin-top:4px}.explanation.is-correct{background:#edf4e9;border-color:#d5e2cd}.feedback-heading{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:7px}.feedback-heading strong{font-size:18px;color:#366b53!important}.is-wrong .feedback-heading strong{color:#875735!important}.feedback-heading span{font-size:12px;color:#7d6d58}.explanation p{font-size:15px;line-height:1.9;margin:12px 0 0}.source-details{border-top:1px solid #ddd5c5;padding-top:11px;margin-top:15px}.source-details summary{font-size:12px;color:#786651;cursor:pointer}.source-details a{display:block;font-size:12px;color:#24636a!important;margin-top:8px;overflow-wrap:anywhere}#learnContinue:empty{display:none}#learnContinue{position:sticky;bottom:-24px;padding:16px 0 3px;background:#fffbf3;margin-top:6px;border-top:1px solid #eadfcd}#learnContinue .primary{margin:0}.lesson-save-note{font-size:12px!important;text-align:center;color:#887760;line-height:1.6!important;margin:12px 0!important}
@keyframes cream-hint{50%{box-shadow:0 0 0 3px #38736d;transform:scale(.96)}}
@media(max-width:360px){main{padding-left:12px;padding-right:12px}.wordmark{font-size:23px}.goals{padding:12px 10px}.moves{width:84px;padding:4px 7px}.moves b{font-size:36px}#goals{gap:3px 8px}.goal{font-size:21px}.mini{width:28px;height:28px}.playfield{padding:6px}#board{gap:3px}.cell{border-radius:8px}dialog,dialog[data-kind="lesson"]{padding:19px}.learn-option{padding:12px 10px}dialog h2.question{font-size:18px}#learnContinue{bottom:-19px}}

/* Stable goal strip: columns depend on stage goals, never on remaining digits. */
#goals{display:grid;grid-template-columns:repeat(var(--goal-count,3),minmax(0,1fr));gap:4px;align-items:start}
#goals .goal{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:2px;line-height:1.2;white-space:nowrap;min-width:0}
#goals .goal-count{display:block;width:2ch;min-height:1.2em;text-align:center;font-variant-numeric:tabular-nums;line-height:1.2}
#goals .mini{display:block;width:30px;height:30px;flex:none;margin:0}
.moves b{font-variant-numeric:tabular-nums}
@media(max-width:360px){#goals .mini{width:28px;height:28px}}
/* Complete game icon set. Numbers are state labels; no font-based pictograms. */
.gem.crate-gem,.gem.key,.mini.box-mini,.mini.key,.mechanic-box,.mechanic-key{background-image:url('assets/obstacles-felt.png');background-repeat:no-repeat;background-size:200% 100%;border:0;border-radius:0;box-shadow:none;background-color:transparent;display:block}
.gem.crate-gem,.mini.box-mini,.mechanic-box{background-position:0% 50%}
.gem.key,.mini.key,.mechanic-key{background-position:100% 50%}
.cell.glass,.cell.double{border:0;box-shadow:0 2px 1px #af895026;background:#fff9ef}
.glass-overlay{position:absolute;inset:0;z-index:2;pointer-events:none}
.glass-art{display:block;width:100%;height:100%}
.mini.glass{background:none;border:0;border-radius:0;box-shadow:none}
.layer-count{z-index:4;pointer-events:none;border:1px solid #fff8e8;min-width:18px;height:18px;line-height:16px}
.ui-icon{display:inline-block;width:1em;height:1em;vertical-align:middle;flex:none}
.goal-count .icon-check{width:1em;height:1em;vertical-align:-.05em}
.rating{display:inline-flex;align-items:center;justify-content:center;gap:.08em;line-height:1;vertical-align:middle}
.stars .rating{font-size:34px;letter-spacing:0}
.map-stage small .rating{font-size:12px;color:#a77725}
.map-stage .icon-lock{width:16px;height:16px;color:#947b60}
.mechanic-art{display:inline-block;position:relative;width:64px;height:64px;flex:0 0 64px}
.mechanic-preview{display:flex;justify-content:center;margin:12px 0}
.mechanic-preview .mechanic-art{width:80px;height:80px;flex-basis:80px}
.mechanic-guide{margin:20px 0;padding-top:4px;border-top:1px solid #e6d7c3}
.mechanic-guide>div{display:flex;align-items:center;gap:14px;margin:14px 0;font-size:14px;line-height:1.7}
.mechanic-guide b{display:block;font-size:15px;margin-bottom:2px}
.mechanic-rocket{background-image:url('assets/property-pieces-cream6.png');background-size:394.22222222% 206.27906977%;background-position:66.84290030% 100%;background-repeat:no-repeat}

#help{display:grid;place-items:center}

/* Lesson feedback stays beside the choices; preserve the current scroll position after an answer. */
#learnContinue{position:static;bottom:auto;padding:14px 0 3px;background:transparent;margin-top:10px;border-top:1px solid #eadfcd}
.quick-feedback{display:flex;flex-direction:column;gap:3px;padding:10px 12px;margin:0 0 11px;border:1px solid #d5e2cd;border-radius:12px;background:#edf4e9;color:#345e42}
.quick-feedback strong{font-size:15px;line-height:1.4}
.quick-feedback span{font-size:12px;line-height:1.5;color:#6b7660}
.quick-feedback.is-wrong{border-color:#e7d5c4;background:#f7efe5;color:#805238}
.quick-feedback.is-wrong span{color:#806e5d}
#learnQuickFeedback:empty{display:none}
.gem-motion{position:relative;z-index:1;transition:transform .16s ease-out}
.gem-motion.dragging{transition:none;animation:none!important;pointer-events:none}
.cell{z-index:auto}
.gem-motion.drag-neighbor{z-index:2}
.gem-motion.drag-source{z-index:3}
.glass-overlay{z-index:4}
.layer-count{z-index:5}

/* Never create a parent stacking context while a board cell is held. */
.cell:active:not(:disabled){filter:none}
/* Cascades grow in warmth, scale and light without moving the board. */
#cheer{inset:31% 0 auto;display:flex;align-items:baseline;justify-content:center;gap:5px;font-size:32px;color:#f16a42;text-shadow:0 3px 0 #bd3923,0 5px 12px #8f392a45;-webkit-text-stroke:1.5px #fffdf0;paint-order:stroke fill;letter-spacing:-.03em}
#cheer .combo-number{font-size:1.65em;line-height:1;font-weight:950}#cheer .combo-label{font-size:.8em;font-weight:900}
#cheer[data-tier="3"]{font-size:39px;color:#ffbb27;text-shadow:0 3px 0 #b96917,0 0 20px #ffe28b}
#cheer[data-tier="4"]{font-size:45px;color:#f35489;text-shadow:0 3px 0 #b02b60,0 0 23px #ffbed3}
#cheer[data-tier="5"]{font-size:50px;color:#ffb825;text-shadow:0 4px 0 #c35a29,0 0 28px #fff19c}
#cheer.show{animation:combo-pop .78s cubic-bezier(.2,.8,.3,1) both}
#cheer[data-tier="4"].show,#cheer[data-tier="5"].show{animation:combo-big .9s cubic-bezier(.2,.8,.3,1) both}
#fx .spark{width:6px;height:6px;background:#ffca45;box-shadow:0 0 7px #ffb73d;border-radius:2px;animation:combo-spark .55s ease-out forwards}
#fx .spark:nth-child(3n){background:#ff7967}#fx .spark:nth-child(3n+1){background:#fff8b0}
#fx[data-tier="3"] .spark{width:8px;height:8px}#fx[data-tier="4"] .spark,#fx[data-tier="5"] .spark{width:9px;height:9px;box-shadow:0 0 10px #ffd351}
.combo-glow{position:absolute;inset:5%;border-radius:50%;background:radial-gradient(ellipse,#ffde6d55,transparent 65%);animation:combo-light .5s ease-out forwards;pointer-events:none}
#fx[data-tier="4"] .combo-glow{background:radial-gradient(ellipse,#ff83aa55,transparent 68%)}#fx[data-tier="5"] .combo-glow{inset:0;background:radial-gradient(ellipse,#fff3b899,#ffbe5044 40%,transparent 70%)}
.rocket-trail{position:absolute;background:linear-gradient(90deg,transparent,#ffb33c,#fff8bc,#ffb33c,transparent);box-shadow:0 0 14px #ffba35,0 0 5px #fff;animation:rocket-trail .42s ease-out forwards}
.rocket-x{width:100%;height:12px;margin-top:-6px}.rocket-y{height:100%;width:12px;margin-left:-6px;background:linear-gradient(0deg,transparent,#ffb33c,#fff8bc,#ffb33c,transparent)}
.rocket-trail:after{content:'';position:absolute;width:22px;height:22px;border-radius:50%;background:#fffef0;box-shadow:0 0 14px 5px #ffdd65}
.rocket-x:after{top:-5px;animation:rocket-run-x .32s ease-out forwards}.rocket-y:after{left:-5px;animation:rocket-run-y .32s ease-out forwards}
.blast-flash,.blast-ring,.blast-spark{position:absolute;pointer-events:none}
.blast-flash{width:45%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fff9d7,#ffd35bbb 30%,#ff963d55 55%,transparent 72%);animation:blast-light .42s ease-out forwards}
.blast-ring{width:16%;aspect-ratio:1;border:4px solid #ffdd77;border-radius:50%;box-shadow:0 0 12px #ffc34b,inset 0 0 8px #fff3b7;animation:blast-wave .46s ease-out forwards}
.blast-ring.outer{border-width:2px;border-color:#fff3c4;animation-delay:.06s}
.blast-spark{width:6px;height:6px;background:#fff3ad;border-radius:50%;box-shadow:0 0 7px #ffb640;animation:combo-spark .48s ease-out forwards}
@keyframes combo-pop{0%{opacity:0;transform:scale(.55) rotate(-5deg)}20%{opacity:1;transform:scale(1.12) rotate(2deg)}35%,65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(-22px) scale(1.04)}}
@keyframes combo-big{0%{opacity:0;transform:scale(.45) rotate(-9deg)}20%{opacity:1;transform:scale(1.18) rotate(3deg)}35%{transform:scale(.97) rotate(-1deg)}50%,72%{opacity:1;transform:scale(1.04)}100%{opacity:0;transform:translateY(-28px) scale(1.1)}}
@keyframes combo-spark{0%{opacity:1;transform:translate(-50%,-50%) scale(.5)}35%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--spin,0deg)) scale(.2)}}
@keyframes combo-light{0%{opacity:0;transform:scale(.6)}25%{opacity:1}100%{opacity:0;transform:scale(1.15)}}
@keyframes rocket-trail{0%{opacity:0;scale:.7}20%{opacity:1;scale:1}100%{opacity:0;scale:1}}
@keyframes rocket-run-x{from{left:0}to{left:100%}}@keyframes rocket-run-y{from{top:0}to{top:100%}}
@keyframes blast-light{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1.3)}}
@keyframes blast-wave{0%{opacity:1;transform:translate(-50%,-50%) scale(.4)}100%{opacity:0;transform:translate(-50%,-50%) scale(3.8)}}
@media(prefers-reduced-motion:reduce){#cheer.show{animation:none;opacity:1}#fx .spark,.blast-spark,.combo-glow,.rocket-trail,.blast-flash,.blast-ring{animation:none;display:none}}
