:root{--ink:#16415f;--aqua:#e6fcf4;--tint:#ffcc6b}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;font-family:system-ui,-apple-system,'Segoe UI',Arial,sans-serif;background:#e8f7f6;color:var(--ink)}button{font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:5px solid #f3b445;outline-offset:3px}#app{width:100%;height:100dvh;display:grid;grid-template-rows:64px minmax(0,1fr) 42px;background:linear-gradient(150deg,#dcf9ff,#f6fff0 55%,#fff8e7)}.topbar{background:linear-gradient(90deg,#104163,#196a91);padding:5px 20px;display:flex;gap:10px;align-items:center;box-shadow:0 4px 17px #0e4a6040;z-index:2;color:white}.brand{font-size:clamp(17px,2vw,25px);font-weight:1000;white-space:nowrap;max-width:33vw;overflow:hidden;text-overflow:ellipsis}.grow{flex:1}.iconButton{height:45px;min-width:47px;background:#ffffff2b;border:2px solid #ffffff75;border-radius:16px;color:#fff;font-size:24px;font-weight:900}.iconButton:hover{background:#ffffff4d}.progressMini{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:85px;font-size:14px;font-weight:900;white-space:nowrap}.bar{width:100%;height:8px;background:#e7f4f17e;border-radius:9px;overflow:hidden}.bar>div{height:100%;width:0;background:#ffe17d;border-radius:9px}.stage{min-height:0;min-width:0;padding:10px;overflow:hidden;position:relative}.statusbar{background:#f9fff8;border-top:2px solid #cce4d9;color:#426c75;padding:0 16px;display:flex;align-items:center;gap:10px;justify-content:space-between;font-size:13px;font-weight:800}.statusbar #status{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.powered{white-space:nowrap;color:#2a9c7f;font-size:12px}.mapLayout{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.mapFrame{width:min(calc((100dvh - 157px)*1.757),100%,1150px);max-height:calc(100% - 28px);aspect-ratio:1.757;position:relative;overflow:hidden;border-radius:26px;border:5px solid white;box-shadow:0 12px 35px #295d5d40;background:#b8e7ed}.mapArt{width:100%;height:100%;object-fit:fill;display:block}.mapNode{position:absolute;width:clamp(34px,5vw,68px);height:clamp(34px,5vw,68px);transform:translate(-50%,-50%);border:5px solid #fff;border-radius:50%;background:var(--node);color:white;font-size:clamp(15px,2.5vw,30px);display:grid;place-items:center;box-shadow:0 5px 18px #172c5070;animation:pulse 2.8s ease-in-out infinite}.mapNode:hover{scale:1.08}.mapNode span{margin-left:3px;text-shadow:0 1px 4px #0004}@keyframes pulse{50%{box-shadow:0 0 0 9px #fff7,0 5px 18px #172c5090}}.mapTip{font-size:clamp(12px,1.4vw,17px);font-weight:950;color:#306e72;margin:2px 0}.unitView{height:100%;max-width:1420px;margin:auto;background:#fffdf7;border:4px solid white;border-radius:27px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:11px;padding:19px 24px;box-shadow:0 10px 35px #214c5a2c}.unitHead{display:flex;gap:16px;align-items:center;border-bottom:4px solid var(--unit);padding-bottom:11px}.unitEmblem{width:96px;height:96px;border-radius:22px;background:color-mix(in srgb,var(--unit) 10%,white);display:grid;place-items:center;overflow:hidden;border:3px solid color-mix(in srgb,var(--unit) 40%, white)}
.unitEmblem img{width:100%;height:100%;object-fit:cover}.unitHead h1{margin:0;color:var(--unit);font-size:clamp(26px,3vw,44px);line-height:1}.unitHead p{margin:5px 0 0;font-weight:900;color:#6e8080;font-size:15px}.unitBack{margin-left:auto;border:0;background:#ecf7f8;color:#136d94;padding:13px 18px;border-radius:18px;font-weight:950;white-space:nowrap}.lessonGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:13px;min-height:0}.lessonTile{border:3px solid color-mix(in srgb,var(--unit) 39%,white);background:linear-gradient(160deg,#fff,#f8fbfd);border-radius:23px;min-height:0;position:relative;overflow:hidden;padding:10px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;color:#154560}.lessonTile:hover{border-color:var(--unit);background:#f4fff7}.lessonTile.complete{background:#f0fff1;border-color:#62b979}.lessonIdx{position:absolute;top:7px;left:9px;font-weight:1000;color:white;border-radius:50%;width:31px;height:31px;background:var(--unit);display:grid;place-items:center}.lessonThumb{width:100%;height:45%;min-height:92px;border-radius:16px;overflow:hidden;border:2px solid #e2edef;background:#fff;display:block}.lessonThumb img{width:100%;height:100%;object-fit:contain;display:block}.lessonEmoji{display:none}.lessonName{display:flex;flex-direction:column;align-items:center;gap:3px}.lessonName strong{font-size:clamp(13px,1.6vw,21px);line-height:1.1}.lessonName small{color:#6c8292;font-size:clamp(10px,1vw,13px);font-weight:700}.lessonState{font-size:clamp(10px,1.1vw,14px);font-weight:950;color:var(--unit)}.unitFoot{text-align:center;font-size:13px;color:#537a82;font-weight:850}.lessonShell{height:100%;max-width:1420px;margin:auto;border:4px solid white;border-top:9px solid var(--unit);background:#fffdf8;border-radius:28px;box-shadow:0 10px 33px #31555e24;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr) 33px;padding:9px 20px 9px;gap:9px}.lessonHeader{display:flex;gap:14px;align-items:center;justify-content:center;min-height:82px}.lessonMark{width:88px;height:88px;border-radius:18px;background:#eef9f4;padding:5px;overflow:hidden;border:3px solid color-mix(in srgb,var(--unit) 35%, white)}
.lessonMarkImg{width:100%;height:100%;object-fit:cover;border-radius:12px}.lessonHeader h1{font-size:clamp(25px,3.1vw,43px);margin:0;line-height:1.02;color:#164965}.lessonCategory{font-size:clamp(10px,1.1vw,15px);font-weight:1000;letter-spacing:.12em;text-transform:uppercase;color:var(--unit)}.lessonHeader p{font-size:clamp(12px,1.4vw,17px);font-weight:800;color:#708596;margin:4px 0 0}.listen{margin-left:auto;border:4px solid #fff;border-radius:50%;height:60px;width:60px;background:#187dda;font-size:30px;color:white;box-shadow:0 3px 9px #1d5b8e44}.lessonMain{min-width:0;min-height:0;display:flex;justify-content:center;align-items:stretch}.lessonFooter{display:flex;justify-content:space-between;align-items:center;color:#64878b;font-weight:900;font-size:13px;border-top:2px solid #e2eeed;padding-top:4px}.studyPic{min-height:0;border:4px solid #dcebe9;max-width:min(690px,100%);width:100%;border-radius:25px;background:linear-gradient(160deg,#fffcf1,#eafcf4);padding:10px;display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center;position:relative;overflow:hidden}.studyPic img{height:calc(100% - 62px);width:100%;min-height:0;object-fit:contain;border-radius:17px}.studyName{font-size:clamp(21px,3vw,40px);font-weight:1000;color:#164b62}.tapBadge{position:absolute;right:15px;top:12px;background:#087fc8;color:white;padding:8px 14px;font-size:14px;border-radius:17px;font-weight:900}.studyPic.isHeard{border-color:#3eb980;background:#effff2}.choiceGrid{width:100%;height:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;min-height:0}.choiceGrid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.pictureChoice{min-width:0;min-height:0;border:4px solid #d7e8e4;border-radius:24px;background:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:11px;gap:6px;overflow:hidden;box-shadow:0 3px 11px #153d4f11}.pictureChoice:hover{border-color:#2c8edd}.pictureChoice img{width:100%;height:calc(100% - 32px);object-fit:contain;min-height:0;border-radius:12px}.pictureChoice b{font-size:clamp(14px,1.75vw,24px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:95%}.pictureChoice.correct,.matchItem.correct,.speakerTile.correct{border-color:#2aae77;background:#eaffed}.pictureChoice.wrong,.puzzleSlot.tryAgain{border-color:#e47170;animation:shake .27s}@keyframes shake{50%{transform:translateX(9px)}}.videoArea{display:grid;grid-template-rows:minmax(0,1fr) auto;width:min(100%,1000px);gap:8px}.videoArea video{width:100%;height:100%;min-height:0;object-fit:contain;background:#173950;border-radius:18px}.videoBar{display:flex;justify-content:center;gap:11px}.videoBar button,.endButtons button,.hint,#progressMap{border:0;border-radius:16px;background:#157cba;color:white;padding:9px 20px;font-weight:1000;font-size:17px}.matchBoard{display:grid;grid-template-columns:1fr .2fr 1fr;gap:0;width:min(990px,100%);height:100%;min-height:0}.speakers,.matchOptions{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:9px;min-height:0}.speakerTile{border:4px solid #bcdfec;border-radius:21px;background:#eaf9ff;font-size:clamp(30px,4vw,58px);color:#146387;font-weight:950;display:flex;align-items:center;justify-content:space-evenly}.speakerTile span{font-size:23px}.speakerTile.active{border-color:#e8aa47;background:#fff6da}.matchOptions .matchItem{height:100%;min-height:0;border:4px solid #d8e7e6;background:#fff;border-radius:18px;padding:5px}.matchItem img{height:100%;width:100%;object-fit:contain}.linkArea{position:relative;min-width:0}.linkArea svg{position:absolute;width:100%;height:100%;overflow:visible;pointer-events:none}.dressBoard{display:grid;grid-template-columns:1fr 1.4fr;gap:14px;width:100%;min-height:0}.dressedPerson{border:4px solid #e8e9d8;border-radius:19px;background:#fffaf3;min-height:0;overflow:hidden}.dressedPerson img{height:100%;width:100%;object-fit:contain}.dressOptions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;min-height:0}.puzzleLayout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:22px;max-width:1000px;width:100%;min-height:0;align-items:center;justify-content:center}.puzzleBoard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));aspect-ratio:1.1;margin:auto;max-height:100%;height:100%;max-width:100%;border:8px solid #d8a878;border-radius:24px;overflow:hidden;background:#f5e9ce;box-shadow:0 8px 17px #995c2940}.puzzleSlot{border:3px dashed #cae0c7;background:#eaf5e5;min-width:0;min-height:0;display:grid;place-items:center;overflow:hidden;font-size:44px;font-weight:1000;color:#b6d5ca;background-size:200% 200%}.puzzleSlot.solved{border:1px solid white;background-repeat:no-repeat}.puzzlePool{height:100%;min-height:0;display:flex;flex-direction:column;align-items:center;gap:8px;justify-content:center}.puzzlePool h2{margin:0;font-size:23px}.puzzlePieces{min-height:0;width:100%;max-height:75%;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:8px}.puzzlePiece{aspect-ratio:1.2;min-height:0;min-width:0;border:5px solid white;outline:2px solid #c6ddd3;border-radius:18px;background-size:200% 200%;background-repeat:no-repeat;background-color:#edfcf8;box-shadow:0 3px 8px #214e4c33}.puzzlePiece.picked{outline:6px solid #f6ae3b}.puzzlePiece.used{opacity:.15;pointer-events:none;filter:grayscale(1)}.hint{font-size:13px;padding:6px 15px}.hintPreview{position:absolute;z-index:3;right:3%;bottom:9%;width:130px;height:135px;background:white;padding:7px;border:3px solid orange;border-radius:12px;box-shadow:0 6px 20px #0003}.hintPreview img{height:100%;width:100%;object-fit:contain}.overlay{position:fixed;inset:0;z-index:15;background:#17384c7f;display:grid;place-items:center;pointer-events:none}.overlay[hidden],.hintPreview[hidden]{display:none!important}.winBox{background:#f1ffe8;border:8px solid white;border-radius:30px;padding:21px 38px;display:flex;flex-direction:column;gap:8px;align-items:center;box-shadow:0 15px 40px #17385566}.winBox strong{color:#17814f;font-weight:1000;font-size:clamp(35px,5.5vw,70px)}.winBox span{color:#347287;font-size:clamp(18px,2.5vw,30px);font-weight:900}.finished{height:100%;max-width:900px;margin:auto;background:#fffdf7;border:5px solid white;box-shadow:0 9px 25px #22524e22;border-radius:30px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;text-align:center}.medal{font-size:clamp(65px,11vh,120px)}.finished h1{font-size:clamp(40px,7vw,85px);margin:0;color:#159672}.finished h2{font-size:clamp(24px,4vw,45px);margin:0}.finished p{font-size:clamp(14px,2.2vw,23px);font-weight:850;margin:0;color:#657f86}.stars{font-size:clamp(30px,4vw,57px)}.endButtons{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}.endButtons button{font-size:16px}.progressScreen{height:100%;background:#fff;border-radius:25px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:13px;padding:20px}.progressScreen h1{font-size:clamp(30px,4vw,57px);margin:0;color:#1e7890}.progressScreen h2{margin:0}.badges{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;width:100%}.badgeTile{border:3px solid #dbebe1;border-radius:22px;background:#f6fdf5;display:flex;flex-direction:column;gap:7px;align-items:center;padding:14px 7px;color:#15496b}.badgeTile span{font-size:clamp(29px,4vw,60px)}.badgeTile b{font-size:clamp(11px,1.3vw,18px)}.badgeTile small{font-weight:750}.badgeTile:hover{border-color:#2b91cd}
@media(max-width:1000px){#app{grid-template-rows:53px minmax(0,1fr) 32px}.topbar{padding:3px 7px;gap:5px}.iconButton{height:38px;min-width:38px;font-size:21px;border-radius:12px}.brand{font-size:16px}.progressMini{min-width:58px;font-size:10px}.stage{padding:5px}.lessonShell{padding:6px 10px;gap:3px}.lessonHeader{min-height:59px}.lessonHeader h1{font-size:26px}.lessonMark{font-size:27px}.listen{width:43px;height:43px;font-size:23px}.lessonFooter{font-size:11px}.unitView{padding:10px 12px;gap:5px}.unitHead{padding-bottom:5px}.unitEmblem{height:64px;width:64px}.unitHead h1{font-size:28px}.lessonGrid{gap:6px}.lessonTile{border-radius:14px;padding:5px}.lessonThumb{min-height:74px;height:42%}.lessonName strong{font-size:14px}.lessonName small{font-size:10px}.lessonState{font-size:10px}.lessonIdx{width:23px;height:23px;font-size:12px}.puzzleLayout{gap:8px}.mapFrame{width:min(calc((100dvh - 128px)*1.757),100%,1150px)}}
@media(max-width:690px){.powered{display:none}.statusbar{font-size:10px}.brand{max-width:25vw;font-size:12px}.iconButton{min-width:32px;height:33px;font-size:17px}.progressMini{min-width:43px}.topbar{gap:3px}.unitBack{padding:8px;font-size:11px}.unitHead p{font-size:11px}.unitHead h1{font-size:21px}.unitEmblem{display:none}.lessonGrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:3px}.lessonTile{flex-direction:row;gap:5px;justify-content:space-around}.lessonEmoji{font-size:22px}.lessonIdx{position:static;flex-shrink:0;width:19px;height:19px}.lessonName{align-items:flex-start;min-width:0}.lessonName strong{font-size:11px}.lessonName small{font-size:9px}.lessonState{font-size:10px;white-space:nowrap}.unitFoot{font-size:10px}.lessonMark{display:none}.lessonHeader h1{font-size:19px}.lessonCategory{font-size:9px}.lessonHeader p{font-size:11px}.listen{height:36px;width:36px;font-size:20px}.lessonShell{grid-template-rows:47px minmax(0,1fr) 24px;padding:5px}.lessonHeader{min-height:0}.studyPic{border-radius:13px}.studyName{font-size:17px}.tapBadge{font-size:9px}.choiceGrid,.choiceGrid.four{gap:4px}.pictureChoice{border-width:2px;padding:3px;border-radius:10px}.pictureChoice b{font-size:10px}.dressBoard{gap:4px}.lessonFooter span{font-size:9px}.mapTip{font-size:10px}.mapFrame{width:min(calc((100dvh - 123px)*1.757),100%,1150px)}.mapNode{width:31px;height:31px;border-width:2px}.speakerTile{font-size:24px}.speakerTile span{font-size:11px}.puzzleLayout{gap:4px}.puzzlePool h2{font-size:12px}.puzzlePiece{border-width:2px;border-radius:8px}.puzzleBoard{border-width:4px;border-radius:10px}.hint{font-size:9px;padding:5px}.badges{grid-template-columns:repeat(3,1fr)}.badgeTile{padding:5px}.badgeTile span{font-size:24px}.badgeTile b{font-size:10px}.progressScreen{gap:5px}}
.lessonGrid.short{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr;width:min(100%,920px);margin:auto}.lessonGrid.short .lessonTile{min-height:0}.lessonGrid.short .lessonThumb{height:52%;min-height:130px}
@media(max-width:690px){.lessonGrid.short{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr}.lessonGrid.short .lessonTile{flex-direction:column}.lessonGrid.short .lessonThumb{min-height:92px;height:42%}}

/* New kindergarten interactions: one screen, large touch targets, photos remain uncropped. */
.zoomGame,.scratchGame,.traceGame,.colourGame,.lettersGame,.crosswordGame,.careerGame,.soundSame,.animalGame{width:100%;height:100%;min-height:0;display:flex;align-items:center;justify-content:center;gap:18px}.zoomGame{flex-direction:column}.zoomPrompt{font-size:clamp(18px,3vw,38px);font-weight:900;display:flex;gap:25px;align-items:center}.zoomPrompt b{color:#0f86ac}.zoomChoices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;max-width:1070px;min-height:0;flex:1;gap:12px}.zoomItem{min-height:0;background:#fff;border:4px solid #d0e5d8;border-radius:24px;padding:8px;overflow:hidden}.zoomItem img{width:100%;height:100%;object-fit:contain}.zoomReveal{position:absolute;inset:14% 25%;background:#fff;border:9px solid #f7cb5b;border-radius:35px;box-shadow:0 10px 45px #1b445c7c;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center}.zoomReveal[hidden]{display:none}.zoomReveal img{min-height:0;max-height:75%;width:90%;object-fit:contain}.zoomReveal strong{font-size:clamp(20px,4vw,44px)}.scratchGame{flex-direction:column}.scratchPhoto{height:88%;aspect-ratio:1.1;max-width:95%;border-radius:26px;overflow:hidden;position:relative;border:6px solid #def1e3;background:#fff}.scratchPhoto img{width:100%;height:100%;object-fit:contain}.scratchPhoto canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.scratchHelp{font-size:clamp(13px,1.8vw,21px);font-weight:900}.memoryBoard{height:100%;width:min(100%,960px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:14px}.memoryCard{border:5px solid #98cfc3;border-radius:24px;background:linear-gradient(140deg,#53bed0,#aaf0d9);display:grid;place-items:center;min-height:0;position:relative;overflow:hidden}.memoryBack{font-size:clamp(48px,8vw,105px);font-weight:900;color:#fff}.memoryCard img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:white}.memoryCard img[hidden],.memoryBack[hidden]{display:none}.traceReference,.colourReference,.lettersPic{width:33%;height:95%;background:white;border:4px solid #d8e6df;border-radius:25px;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.traceReference img,.colourReference img,.lettersPic img{width:100%;height:85%;object-fit:contain}.traceReference b,.colourReference span{font-size:clamp(16px,2vw,25px);font-weight:900}.traceCanvasWrap{height:95%;width:62%;display:flex;flex-direction:column;background:white;border:5px solid #d5e8e0;border-radius:25px;overflow:hidden}.traceCanvasWrap canvas{min-height:0;flex:1;width:100%;touch-action:none}.traceCounter{font-size:17px;text-align:center;font-weight:900;padding:10px;background:#fff6d9}.careerGame{flex-direction:column}.careerQuestion{display:flex;gap:25px;align-items:center;text-align:center}.careerQuestion h2{font-size:clamp(18px,3vw,37px);margin:0}.careerQuestion p{font-size:clamp(15px,2vw,24px);margin:0}.careerChoices{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:15px;width:100%;min-height:0}.careerChoices .pictureChoice img{height:calc(100% - 32px)}.blueBtn,.orangeBtn{border:none;border-radius:18px;padding:13px 18px;color:white;background:#1b85c3;font-size:clamp(13px,1.8vw,21px);font-weight:900}.orangeBtn{background:#e47d27}.animalGame{flex-direction:column}.animalGame>img{height:62%;width:92%;object-fit:contain}.animalGame>strong{font-size:clamp(20px,3vw,40px)}.animalControls{display:flex;gap:20px;justify-content:center}.colourReference{width:35%}.colourBoard{width:60%;height:94%;min-height:0;display:flex;flex-direction:column;gap:7px}.colourBoard canvas{width:100%;flex:1;min-height:0;background:white;border:4px solid #dce9e7;border-radius:25px;touch-action:none}.palette{display:flex;height:46px;gap:12px;justify-content:center}.palette button{width:45px;height:45px;border-radius:50%;border:4px solid white;box-shadow:0 0 0 2px #bcc8c1}.palette button.selected{box-shadow:0 0 0 5px #24425f}.lettersGame{gap:30px}.lettersPic{width:36%}.lettersRight{width:62%;height:95%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px}.lettersRight strong{font-size:clamp(19px,3vw,40px)}.progressLetters{display:flex;gap:5px;flex-wrap:wrap;justify-content:center}.progressLetters span{font-size:clamp(23px,3.6vw,49px);font-weight:1000;padding:6px;border-bottom:4px solid #b4c5c9}.progressLetters span.nextLetter{background:#ffdb76;border-radius:12px}.progressLetters span.doneLetter{background:#97e2c1;color:#116448;border-radius:12px}.lettersGrid{width:100%;display:grid;grid-template-columns:repeat(7,1fr);gap:8px}.lettersGrid button{font-size:clamp(20px,2.7vw,37px);font-weight:900;border:3px solid #d4e6e6;border-radius:14px;background:white;padding:7px}.lettersGrid button.correct{background:#92e4be}.lettersGrid button:disabled{opacity:.4}.crossPics{height:92%;width:32%;display:flex;flex-direction:column;gap:8px}.crossPic{height:31%;background:white;border:4px solid #d5e6e0;border-radius:16px;overflow:hidden}.crossPic img{width:100%;height:100%;object-fit:contain}.crossPic.active{border-color:#ecaa2a}.crossGrid{height:92%;width:62%;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:12px}.crossRow{display:flex;width:100%;height:28%;justify-content:center;border:none;background:transparent;padding:0;gap:2px}.crossRow span{display:grid;place-items:center;flex:1;background:#fff;border:3px solid #bbd5d0;border-radius:6px;font-size:clamp(18px,3vw,37px);font-weight:1000;white-space:pre}.crossRow.correct span{background:#b6f3c3;border-color:#42b67b}.soundSource{height:85%;width:40%;border-radius:22px;background:white;border:4px solid #d5e8e1;display:flex;flex-direction:column;align-items:center}.soundSource img{height:85%;width:100%;object-fit:contain}.soundSource strong{font-size:25px}.soundChoiceGrid{height:85%;width:56%;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(max-width:720px){.zoomChoices{gap:5px}.zoomItem{padding:2px;border-width:2px}.scratchPhoto{height:82%}.careerQuestion{flex-wrap:wrap;gap:3px;justify-content:center}.careerChoices{gap:5px}.memoryBoard{gap:5px}.traceGame,.colourGame,.crosswordGame{gap:5px}.traceCanvasWrap,.colourBoard{width:70%}.traceReference,.colourReference{width:28%}.lettersGame{gap:6px}.lettersRight{gap:4px}.lettersGrid{gap:3px}.lettersGrid button{padding:3px}.animalGame>img{height:55%}.palette{height:33px}.palette button{width:31px;height:31px}.crossRow span{font-size:14px}.crossGrid{gap:3px}.zoomPrompt{font-size:16px}}

.lettersGrid button.nextHint{background:#ffdd6c;border-color:#e59c26;box-shadow:0 0 13px #ffc75b;animation:hintGlow 1.4s infinite alternate}@keyframes hintGlow{to{box-shadow:0 0 2px #ffc75b}}.crossActual{height:93%;width:64%;min-height:0;display:grid;grid-template-columns:repeat(14,minmax(0,1fr));grid-template-rows:repeat(14,minmax(0,1fr));gap:1px;align-self:center}.crossCell{min-height:0;min-width:0;border:2px solid #b7d8d7;border-radius:3px;background:white;font-size:clamp(10px,1.35vw,20px);font-weight:1000;padding:0;color:#1b4960}.crossCell.empty{background:transparent;border:0;pointer-events:none}.crossCell.solved{background:#9ee9be;border-color:#3cae75}.crossCell.wrong{background:#ffd5d5}.crossPics{width:32%}

/* Créditos de videos (pantalla final accesible desde el pie de página) */
.footerCredits{background:#e9f7ff;border:1px solid #b4ddeb;border-radius:12px;padding:5px 12px;color:#17557c;font-size:12px;font-weight:900;white-space:nowrap;cursor:pointer}
.creditsScreen{height:100%;max-width:1280px;margin:auto;padding:16px 24px;background:#fffdf7;border:4px solid #fff;border-radius:25px;display:flex;flex-direction:column;gap:12px;min-height:0;box-shadow:0 8px 30px #123b491c}
.creditsHeader{text-align:center;flex:0 0 auto}
.creditsHeader h1{font-size:clamp(23px,3.1vw,41px);margin:0 0 4px;color:#145379}
.creditsHeader p{font-size:clamp(12px,1.2vw,17px);margin:0;font-weight:700;color:#4b7388}
.creditsGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:12px;flex:1;min-height:0}
.creditsItem{border:2px solid #c6e4df;background:linear-gradient(155deg,#f1fdf8,#fff8e9);border-radius:16px;display:flex;flex-direction:column;gap:4px;padding:12px 15px;min-height:0;justify-content:center}
.creditsItem strong{font-size:clamp(13px,1.5vw,20px);color:#155479}
.creditsItem span{font-size:clamp(12px,1.2vw,16px);font-weight:700}
.creditsItem small{font-size:clamp(10px,1vw,14px);color:#447481}
.creditsItem a{font-weight:900;color:#1169b5;font-size:clamp(11px,1vw,14px)}
.creditsBottom{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:clamp(10px,1vw,13px);color:#597681;font-weight:650}
.creditsBottom button{flex:none;border:0;background:#146eac;color:white;font-weight:950;padding:9px 15px;border-radius:13px;cursor:pointer}
.youtubeMount{width:100%;height:100%;min-height:0;background:#102f45;border-radius:16px;overflow:hidden;display:grid;place-items:center}
.youtubeMount iframe{height:100%;width:100%;border:0}
.youtubeLoading{color:white;font-weight:900;padding:15px;text-align:center}
.youtubeOpen{display:inline-flex;align-items:center;text-decoration:none;background:#f6f8ff;color:#155b91;padding:9px 20px;border-radius:16px;font-weight:950}
.youtubeArea{grid-template-rows:minmax(0,1fr) auto auto}
.youtubeNote{font-weight:750;color:#436b79;text-align:center;font-size:13px}
@media(max-width:850px){.creditsGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.creditsScreen{gap:6px;padding:8px}.creditsItem{padding:5px 8px;gap:2px}.creditsBottom button{padding:7px;font-size:11px}.creditsItem strong{font-size:12px}.creditsItem span,.creditsItem small{font-size:10px}.creditsItem a{font-size:10px}.footerCredits{padding:4px 7px;font-size:10px}}
@media(max-width:600px){.creditsHeader h1{font-size:20px}.creditsHeader p,.creditsBottom span{font-size:10px}.creditsItem{padding:4px 6px}.creditsItem strong{font-size:11px}.creditsItem span,.creditsItem small{font-size:9px}.creditsBottom button{padding:5px 7px;font-size:10px}}

/* V5.1: kindergarten fixes — single-line tracing, auditory pairs, scratch at own pace */
.traceGuideWrap{position:relative;flex:1;min-height:0;width:100%;background:linear-gradient(145deg,#fff,#f6fcff);overflow:hidden;display:grid;place-items:center}
#traceGuide{display:block;width:95%;height:85%;max-height:100%;pointer-events:none}
#traceCan{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}
.traceCounter{flex:none;font-size:clamp(12px,1.7vw,18px);padding:4px 8px}
.traceDone{border:0;background:#24a871;color:white;font-weight:1000;font-size:clamp(14px,2vw,23px);border-radius:16px;padding:8px 20px;margin:3px auto;flex:none}
.traceDone[hidden],.scratchDone[hidden]{display:none!important}
.soundSource{cursor:pointer;min-height:0;border-color:#55b7d0;box-shadow:0 0 0 3px #e4f9ff;background:#f7fffc;gap:4px;padding:6px}
.soundSource img{height:68%;width:100%;object-fit:contain;min-height:0}
.soundSource strong{font-size:clamp(15px,2vw,25px)}
.soundSource span{font-size:clamp(12px,1.5vw,18px);color:#2b7ea1;font-weight:900}
.soundSource.correct{border-color:#2db47d;background:#eaffec}
.soundSource.hintPulse{outline:6px solid #ffc14c}
.soundChoiceGrid .pictureChoice{width:100%;height:100%;min-height:0}
.scratchPhoto{height:75%;max-height:75%;flex:none}
.scratchMeter{width:min(480px,85%);height:14px;background:#d5eef3;border-radius:20px;overflow:hidden;border:1px solid #b2d8e1;flex:none}
.scratchMeter>div{height:100%;width:0;background:linear-gradient(90deg,#2bb8b2,#7bcb72);border-radius:20px;transition:width .15s ease}
.scratchHelp{font-size:clamp(11px,1.4vw,16px);margin:0;line-height:1.1;text-align:center;flex:none}
.scratchDone{flex:none;align-self:center;border:0;border-radius:17px;background:#279b72;color:white;font-size:clamp(12px,1.5vw,19px);padding:7px 15px;font-weight:900}
.teacherRecovery{font-size:clamp(10px,1vw,12px);padding:3px 7px;border-radius:10px;border:1px solid #b5d1d8;background:#e9f4f5;color:#235d70;font-weight:800;white-space:nowrap;cursor:pointer}
.lessonFooter{gap:5px}
@media(max-width:720px){.scratchPhoto{height:67%;max-height:67%}.traceGuideWrap{min-height:0}.teacherRecovery{font-size:10px;padding:2px 4px}.soundSource span{font-size:10px}.soundSource img{height:58%}.soundSame{gap:5px}.traceDone{font-size:12px;padding:5px 9px}}

/* V5.2 - Correct full-word layouts, local audio intro, recovery feedback. */
.localIntro{grid-template-rows:minmax(0,1fr) auto auto;place-items:center;gap:8px}
.localIntroCard{height:100%;width:min(100%,650px);min-height:0;border:4px solid #b5ddd8;border-radius:22px;background:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px;gap:5px}
.localIntroCard img{display:block;height:calc(100% - 58px);width:100%;min-height:0;object-fit:contain}
.localIntroCard strong{font-size:clamp(21px,2.7vw,38px);color:#144d6d}
#localIntroStep{font-size:12px;font-weight:900;color:#45808f}
.localIntro .videoBar{flex-wrap:wrap;gap:7px;align-items:center}
.localIntro .videoBar button,.localIntro .videoBar a{font-size:clamp(11px,1.1vw,15px);padding:7px 10px;text-decoration:none;border-radius:10px}
.localIntro .youtubeNote{font-size:clamp(10px,1vw,13px);max-width:900px;line-height:1.3;text-align:center}
.winBox button{pointer-events:auto;border:2px solid #47a483;padding:6px 17px;background:white;border-radius:14px;color:#165a75;font-size:17px;font-weight:850;cursor:pointer}
.lettersRight{min-width:0}
.lettersRight strong{max-width:100%;overflow:visible;overflow-wrap:anywhere;text-align:center}
.progressLetters{gap:clamp(2px,.4vw,5px)}
.progressLetters span{font-size:clamp(16px,2.5vw,34px);padding:clamp(1px,.25vw,4px);border-bottom-width:3px}
.lettersGrid{gap:clamp(3px,.5vw,8px)}
.lettersGrid button{font-size:clamp(15px,2.1vw,29px);padding:clamp(3px,.4vw,7px)}
.careerChoices .pictureChoice b{white-space:normal;overflow:visible;text-align:center;line-height:1.1}
@media(max-width:850px){.localIntro .videoBar button,.localIntro .videoBar a{font-size:11px}.lettersRight{gap:5px}.progressLetters span{font-size:clamp(13px,2.4vw,22px)}.lettersGrid button{font-size:clamp(13px,2vw,19px);padding:3px}}

/* V5.3: turn-to-turn memory, not a visible picture matching worksheet */
.memoryCard{perspective:600px;transition:transform .16s,border-color .2s;touch-action:manipulation}
.memoryCard.faceDown{background:linear-gradient(150deg,#0d699a,#49b9ad 70%,#a4e1c4);border-color:#d4f0e9;box-shadow:inset 0 0 0 5px #ffffff66,0 6px 13px #135c7d33}
.memoryCard.faceUp{background:#fff;border-color:#8acdc0}
.memoryCard.faceDown img{display:none!important}
.memoryCard.faceUp .memoryBack,.memoryCard.correct .memoryBack{display:none!important}
.memoryCard .memoryBack{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;position:absolute;inset:0;pointer-events:none}
.memoryStar{font-size:clamp(44px,6vh,78px);color:#fce8a4;text-shadow:0 3px 7px #11577599}
.memoryNum{font-size:clamp(17px,2vh,26px);font-weight:900;color:white}
.memoryCard.correct{border-color:#28b57b;background:#edffed}
/* V5.3 creative colouring: fixed artwork ratio, distinct tools, no countdown */
.proColour{gap:12px;min-height:0}
.proColour .colourReference{width:26%;height:100%;min-width:0;gap:4px}
.proColour .colourReference img{height:72%;width:100%;object-fit:contain}
.proColourBoard{width:73%;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:7px}
.paintToolbar{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px;min-height:39px}
.paintToolbar button,.colourDone,.colourListen{border:2px solid #cadfd6;border-radius:11px;padding:7px 10px;background:white;color:#134967;font-size:clamp(11px,1vw,15px);font-weight:850;white-space:nowrap}
.paintToolbar button.chosen{background:#d5f5e4;border-color:#20a176;color:#116d57}
.paintSurface{position:relative;min-height:0;width:100%;height:100%;aspect-ratio:auto;border:4px solid #d4e5df;border-radius:16px;overflow:hidden;background:white;touch-action:none}
.colourArtwork{position:absolute;width:100%;height:100%;inset:0;object-fit:contain;z-index:1;pointer-events:none}
.colourArtwork .paintRegion{cursor:crosshair}
#paintStrokes{position:absolute;width:100%;height:100%;inset:0;z-index:2;touch-action:none;background:transparent;border:0;pointer-events:auto;border-radius:0}
.paintBottom{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:45px}
.paintBottom .palette{display:flex;height:auto;align-items:center;justify-content:flex-start;gap:6px;min-width:0;flex:1}
.paintBottom .palette button{flex:none;width:clamp(25px,3vw,41px);height:clamp(25px,3vw,41px);border-radius:50%;border:3px solid white}
.paintBottom .palette button.selected{box-shadow:0 0 0 4px #17547d}
.colourDone{background:#168a6c;color:white;border-color:#168a6c;font-size:clamp(12px,1.2vw,17px);padding:9px 12px}
.colourDone:disabled{opacity:.5;cursor:default}
.colourListen{background:#e1f4ff;border-color:#9dd8f5}
@media(max-width:1000px){.proColour .colourReference{width:26%}.proColourBoard{width:73%}.paintToolbar{gap:3px}.paintToolbar button{padding:5px 6px;font-size:10px}.paintBottom .palette{gap:3px}.paintBottom .palette button{width:26px;height:26px}}
@media(max-width:700px){.proColour .colourReference{display:none}.proColourBoard{width:100%}.paintToolbar button{font-size:9px;padding:4px 6px}.paintBottom .palette button{width:22px;height:22px}.paintBottom .palette{gap:3px}}

/* v5.4: Make lesson previews visible and generously sized */
.lessonGrid.short{height:min(100%,390px);align-self:center;margin:auto;min-height:0}
.lessonTile .lessonThumb{background:#f6fbf9;flex-shrink:0}
.lessonTile .lessonThumb img{width:100%;height:100%;display:block;object-fit:contain}
.lessonGrid.short .lessonTile .lessonThumb{height:61%;min-height:0}
.unitEmblem img,.lessonMarkImg{display:block}
@media(max-width:690px){.lessonGrid.short{height:min(100%,350px)}.lessonGrid.short .lessonTile .lessonThumb{height:50%}}

/* V5.5: brief spoken checks, session-spaced review and teacher evidence */
.checkWrap{width:100%;height:100%;display:flex;flex-direction:column;gap:7px;min-height:0;align-items:center}
.checkTop{font-size:clamp(13px,1.7vw,20px);font-weight:900;display:flex;gap:16px;align-items:center;color:#236179}
.checkCards{width:100%;height:calc(100% - 32px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(6px,1.6vw,18px);min-height:0}
.checkCard{height:100%;min-width:0;min-height:0;border:4px solid #bcdfd8;border-radius:22px;background:#fff;overflow:hidden;padding:12px;display:grid;place-items:center}
.checkCard img{display:block;width:100%;height:100%;object-fit:contain}
.checkCard.checkSelected{border-color:#ffc14c;background:#fffaf0}
.reviewLaunch,.reviewActions button,#reviewExit,#teacherEvidence,#evidenceExport,.reviewPick{border:0;border-radius:13px;background:#1376a8;color:#fff;font-weight:900;padding:9px 15px;cursor:pointer}
.reviewLaunch{margin-left:12px;font-size:clamp(11px,1.1vw,14px)}.reviewLaunch:disabled{opacity:.4;cursor:not-allowed}
.reviewMenu,.reviewResult,.evidencePage{height:100%;overflow:hidden;max-width:1080px;margin:auto;background:#fffefa;border:4px solid white;border-radius:22px;display:flex;flex-direction:column;align-items:center;gap:12px;padding:clamp(8px,2vw,22px);text-align:center}
.reviewMenu h1,.reviewResult h1,.evidencePage h1{font-size:clamp(24px,3vw,40px);margin:0}
.reviewMenu p,.reviewResult p,.evidencePage p{margin:0;font-size:clamp(11px,1.3vw,17px)}
.reviewButtons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-height:0;overflow:auto;width:100%}
.reviewPick{background:#eefafa;color:#14536f;border:2px solid #7db7c1;display:flex;flex-direction:column;align-items:center;gap:4px}
.reviewPick small{font-size:10px;font-weight:700;color:#467688}
.reviewActions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.teacherNote{color:#667b81;font-size:clamp(10px,1.1vw,14px)!important;max-width:900px}
.evidenceScroll{overflow:auto;flex:1;min-height:0;width:100%;text-align:left}
.evidenceScroll table{width:100%;border-collapse:collapse;font-size:clamp(10px,1.2vw,16px)}
.evidenceScroll th,.evidenceScroll td{border-bottom:1px solid #cee3e5;padding:7px 5px}
.evidenceScroll th{position:sticky;top:0;background:#dff5f2}
.miniEvidence{font-weight:800;color:#215e74}
.placesMoving{max-width:min(100%,1100px);margin:auto}.placesMoving video{max-height:calc(100dvh - 285px);object-fit:contain;background:#072b46}
.videoCaveat{font-size:clamp(11px,1.05vw,14px);margin:0;text-align:center;color:#637b85;font-weight:700}
@media(max-width:780px){.reviewButtons{grid-template-columns:repeat(2,minmax(0,1fr))}.checkCard{padding:3px;border-radius:11px}.checkCards{gap:5px}.reviewLaunch{margin-left:4px;padding:5px 7px}}

/* Added videos / credits: retain large video controls, allow credits scrolling */
.videoLessonNote{margin:0;text-align:center;font-size:clamp(11px,1.1vw,15px);font-weight:750;color:#496d77;max-height:2.6em;overflow:hidden}
.creditsGrid{overflow-y:auto;grid-auto-rows:minmax(118px,auto);align-content:start;scrollbar-width:thin}
.creditsScreen{min-height:0}
@media(max-width:690px){.creditsGrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(118px,auto)}.videoLessonNote{font-size:10px}}