@font-face{font-family:"Baloo 2";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/baloo2-latin-400.woff2) format("woff2")}@font-face{font-family:"Baloo 2";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/baloo2-latin-600.woff2) format("woff2")}@font-face{font-family:"Baloo 2";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/baloo2-latin-700.woff2) format("woff2")}@font-face{font-family:"Baloo 2";font-style:normal;font-weight:800;font-display:swap;src:url(/fonts/baloo2-latin-800.woff2) format("woff2")}:root{--bg-1: #fff4e6;--bg-2: #ffe7d6;--ink: #3a2e2a;--ink-soft: #6b5a52;--paper: #fffdf7;--paper-edge: #f3e7d3;--accent: #ff7a59;--accent-2: #ffd166;--green: #5ec27a;--blue: #4aa8e8;--pink: #ff6fa3;--purple: #9b7ad6;--shadow: 0 10px 30px rgba(80, 40, 20, .18);--shadow-sm: 0 4px 14px rgba(80, 40, 20, .12);--radius-lg: 28px;--radius-md: 18px;--radius-sm: 12px;--hit: 72px;--book-max: 920px;--book-pad: clamp(14px, 3vw, 28px);--tap: 48px;--title-size: clamp(22px, 4.5vw, 34px);--gap: clamp(10px, 2vw, 18px);--tap-kids: clamp(72px, 12vw, 96px);--gap-kids: clamp(14px, 3vw, 22px);--ink-kids: #2a1f1a;--ink-soft-kids: #5a463e;--success: #4caf50;--success-bg: #d7f0d9;--error: #ffb74d;--error-bg: #fff0d6;--font-size-kids: clamp(20px, 4vw, 28px);--font: "Baloo 2", "Comic Sans MS", "Comic Sans", "Baloo", "Marker Felt", "Trebuchet MS", system-ui, sans-serif;--font-scale: 1;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px);--book-max-on-small: var(--book-max);--emoji-size: clamp(36px, 6.5vw, 60px);--tile-min: clamp(64px, 20vw, 110px);--hero-emoji: clamp(44px, 11vw, 80px);--big-emoji: clamp(72px, 20vw, 140px);--mid-emoji: clamp(36px, 10vw, 56px);--card-gap: clamp(8px, 2vw, 18px);--paint-size: clamp(56px, 16vw, 86px)}@media (orientation: landscape){:root{--book-max: 1100px;--title-size: clamp(20px, 3vw, 30px);--gap: clamp(8px, 1.4vw, 14px)}}@media (min-width: 1024px){:root{--book-max: 1040px;--book-pad: 32px}}@media (min-width: 1440px){:root{--book-max: 1180px;--book-pad: 40px}}@media (max-width: 600px),(max-height: 560px){:root{--book-max-on-small: 100%;--book-spine: 0px;--book-pad: clamp(8px, 3vw, 14px);--emoji-size: clamp(30px, 9vw, 44px);--tile-min: clamp(56px, 22vw, 84px);--hero-emoji: clamp(40px, 12vw, 64px);--big-emoji: clamp(60px, 22vw, 96px);--mid-emoji: clamp(32px, 11vw, 48px);--card-gap: clamp(6px, 2.4vw, 12px);--paint-size: clamp(48px, 18vw, 70px);--tap: clamp(40px, 7vw, 48px);--tap-kids: clamp(56px, 11vw, 80px);--gap-kids: clamp(8px, 2.5vw, 14px)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%;overflow:hidden}body{font-family:var(--font);color:var(--ink);background:radial-gradient(1200px 600px at 10% -10%,#ffd9b8 0%,transparent 60%),radial-gradient(900px 500px at 110% 110%,#ffe7d6 0%,transparent 55%),linear-gradient(180deg,var(--bg-1),var(--bg-2));min-height:100%;user-select:none;-webkit-user-select:none;touch-action:manipulation;font-size:calc(16px * var(--font-scale))}.stage{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:clamp(8px,2vw,24px)}.book{position:relative;width:min(var(--book-max-on-small),100%);height:calc(100vh - (2*clamp(8px,2vw,24px)));height:calc(100dvh - (2*clamp(8px,2vw,24px)));max-height:var(--book-max-on-small);background:var(--paper);border-radius:var(--radius-lg);box-shadow:var(--shadow),inset 0 0 0 6px var(--paper-edge);overflow:hidden;display:flex;flex-direction:column}.book:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:var(--book-spine);background:linear-gradient(180deg,transparent,rgba(0,0,0,.06),transparent);transform:translate(-3px);pointer-events:none;z-index:5}.page{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;padding:var(--book-pad);overflow:hidden}.page[hidden]{display:none!important}.page-shell{animation:page-in .32s ease both}.page-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:safe center;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-top:calc(40px + var(--safe-top));padding-bottom:calc(136px + var(--safe-bottom))}.page-header{text-align:center;flex:0 0 auto}.page-title{font-size:var(--title-size);font-weight:800;margin:4px 0;letter-spacing:.2px}.page-sub{color:var(--ink-soft);font-size:clamp(13px,2.4vw,16px);margin:0 0 8px}.page-title-lg{font-size:clamp(30px,6vw,46px);margin:6px 0}@media (max-width: 600px),(max-height: 560px){.page-title-lg{font-size:clamp(22px,5.5vw,30px);margin:2px 0}.page-sub{font-size:clamp(11px,2.4vw,13px);margin:0 0 4px}}.topbar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;padding:8px 12px;gap:8px;z-index:10;pointer-events:none}.topbar .title{font-weight:800;font-size:clamp(13px,2.6vw,16px);background:var(--paper);padding:3px 10px;border-radius:999px;box-shadow:var(--shadow-sm);pointer-events:auto}.app-controls{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 16px calc(8px + var(--safe-bottom));z-index:12;background:linear-gradient(180deg,transparent,var(--paper) 38%)}.navbar{position:absolute;bottom:80px;bottom:calc(80px + var(--safe-bottom));left:0;right:0;display:flex;align-items:center;justify-content:center;gap:14px;padding:4px 16px;padding-bottom:calc(4px + var(--safe-bottom));z-index:11}.pager{font-weight:700;color:var(--ink-soft);background:var(--paper);padding:4px 12px;border-radius:999px;box-shadow:var(--shadow-sm)}.btn{min-width:var(--tap);min-height:var(--tap);border:none;border-radius:var(--radius-md);background:var(--accent);color:#fff;font:inherit;font-weight:800;font-size:clamp(15px,2.6vw,18px);padding:10px 18px;cursor:pointer;box-shadow:0 6px #b4462d80;transition:transform .08s ease,box-shadow .08s ease;touch-action:manipulation}.kid-btn{min-width:var(--tap-kids);min-height:var(--tap-kids);border:none;border-radius:var(--radius-md);background:var(--accent);color:#fff;font:inherit;font-weight:800;font-size:clamp(18px,3.2vw,24px);padding:12px 22px;cursor:pointer;box-shadow:0 6px #b4462d80;transition:transform .08s ease,box-shadow .08s ease;touch-action:manipulation;display:inline-flex;align-items:center;justify-content:center;gap:8px;-webkit-tap-highlight-color:transparent;line-height:1.2;text-align:center}.kid-btn-primary{background:var(--accent);box-shadow:0 6px #b4462d80}.kid-btn-secondary{background:var(--blue);box-shadow:0 6px #1e5a8c80}.kid-btn-ghost{background:var(--paper);color:var(--ink);border:3px solid var(--paper-edge);box-shadow:0 4px 0 var(--paper-edge)}.kid-btn-round{border-radius:50%;padding:0;width:var(--tap-kids);height:var(--tap-kids)}.kid-btn-selected{outline:5px solid var(--accent-2);outline-offset:3px;background:var(--accent-2);color:var(--ink);box-shadow:0 6px #b48c2d80}.kid-btn-disabled{opacity:.4;cursor:not-allowed}.kid-btn:active:not(.kid-btn-disabled){transform:translateY(4px);box-shadow:0 2px #b4462d80}.kid-btn-secondary:active:not(.kid-btn-disabled){box-shadow:0 2px #1e5a8c80}.kid-btn-ghost:active:not(.kid-btn-disabled){box-shadow:0 2px 0 var(--paper-edge)}.kid-btn-sm{min-width:clamp(56px,9vw,72px);min-height:clamp(56px,9vw,72px);font-size:clamp(14px,2.4vw,18px);padding:8px 14px}.kid-btn-lg{min-width:clamp(96px,16vw,128px);min-height:clamp(72px,12vw,96px);font-size:clamp(22px,4vw,28px);padding:16px 28px}.btn:active{transform:translateY(4px);box-shadow:0 2px #b4462d80}.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:0 6px #b4462d40}.grid-view{grid-template-columns:repeat(auto-fit,minmax(var(--tile-min, 72px),1fr))}@media (min-width: 560px){.grid-view{grid-template-columns:repeat(var(--gv-cols, 4),minmax(0,1fr))}}.btn.secondary{background:var(--blue);box-shadow:0 6px #1e5a8c80}.btn.ghost{background:var(--paper);color:var(--ink);border:3px solid var(--paper-edge);box-shadow:0 4px 0 var(--paper-edge)}.btn.round{border-radius:50%;width:var(--tap);height:var(--tap);padding:0;font-size:22px;display:inline-flex;align-items:center;justify-content:center}.grid{display:grid;gap:var(--gap);width:100%;flex:1 1 auto;min-height:0;align-content:start;grid-template-columns:repeat(auto-fit,minmax(var(--tile-min, 96px),1fr));grid-auto-rows:minmax(48px,auto);padding:8px 4px;-webkit-overflow-scrolling:touch}.grid-view-lg .card{min-height:72px!important;min-width:var(--tile-min, 72px)}@media (max-width: 600px),(max-height: 560px){.card{padding:6px 4px;gap:3px;min-height:clamp(60px,14vw,84px)!important}.grid-view-lg .card{min-height:clamp(72px,14vw,96px)!important}.card .emoji{line-height:1.2}.card .facts{font-size:clamp(11px,2.4vw,13px);line-height:1.3;opacity:.85}}@media (min-width: 560px){.grid-view-lg{grid-template-columns:repeat(var(--gv-cols, 4),minmax(0,1fr))}.grid-view-lg .card{min-height:96px}}.card{min-height:48px!important;min-width:48px;max-width:100%;overflow:hidden;border:none;border-radius:var(--radius-md);background:#fff;box-shadow:0 4px #785a462e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px;cursor:pointer;font:inherit;font-weight:700;color:var(--ink);transition:transform .1s ease;touch-action:manipulation;animation:pop .28s ease both}.card .emoji{font-size:var(--emoji-size);line-height:1.15}.card .facts{font-size:clamp(11px,2.4vw,14px);font-weight:600;line-height:1.25;opacity:.85;text-align:center}.card:active{transform:scale(.95)}.card.selected{outline:4px solid var(--accent);outline-offset:2px}.swatch{border-radius:50%;aspect-ratio:1;width:100%;max-width:90px;margin:0 auto;border:4px solid #fff;box-shadow:0 4px #785a462e;cursor:pointer;min-width:48px!important;min-height:48px!important}.number-card{gap:6px;padding:12px 8px}.number-digit{font-size:clamp(34px,7vw,52px);font-weight:800;line-height:1;color:var(--accent)}.number-word{font-size:clamp(13px,2.6vw,17px);font-weight:700;color:var(--ink)}.number-dots{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px;min-height:24px;font-size:clamp(15px,3vw,20px);line-height:1}@media (max-width: 600px),(max-height: 560px){.number-dots{font-size:clamp(11px,3vw,14px);gap:1px;min-height:18px}.number-digit{font-size:clamp(24px,6vw,32px)}.number-word{font-size:clamp(11px,2.4vw,13px)}.numbers-caption{font-size:clamp(13px,2.8vw,16px);margin:var(--gap) 0 0}.number-card{padding:6px 4px;gap:2px}}.number-dots .dot{animation:pop .28s ease both}.numbers-caption{margin:calc(var(--gap) * .5) 0 0;text-align:center;font-size:clamp(15px,3vw,20px);font-weight:700;color:var(--ink-soft)}.cover-page{align-items:center;justify-content:center;text-align:center;padding-top:var(--book-pad);padding-bottom:var(--book-pad)}.cover-inner{display:flex;flex-direction:column;align-items:center;gap:10px;animation:cover-open .55s cubic-bezier(.2,.8,.3,1) both}@keyframes cover-open{0%{opacity:0;transform:scale(.82)}60%{opacity:1}to{opacity:1;transform:scale(1)}}.cover-emoji{font-size:clamp(48px,12vw,88px);line-height:1;animation:pulse 2.4s ease-in-out infinite}@media (max-width: 600px),(max-height: 560px){.cover-emoji{font-size:clamp(44px,12vw,64px)}.cover-start{padding:10px 20px}}.cover-title{font-size:var(--title-size);font-weight:800;margin:4px 0;letter-spacing:.3px}.cover-sub{color:var(--ink-soft);max-width:360px;margin:0}.cover-meta{font-weight:700;margin:4px 0 8px}.cover-start{margin-top:12px;font-size:clamp(18px,3.4vw,22px);padding:14px 26px;animation:pop .4s ease .25s both}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}.panel-head h2{margin:0;font-size:clamp(18px,3vw,22px)}.profile-row{display:flex;gap:10px;flex-wrap:wrap}.profile-row .card{min-width:84px;background:#fff}.profile-row .card.selected{background:var(--accent-2)}.profile-add{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.text-input{flex:1;min-width:140px;padding:10px 12px;border-radius:12px;border:3px solid var(--paper-edge);font:inherit;background:#fff}.text-input:focus-visible{outline:4px solid var(--blue);outline-offset:2px}.profile-card{margin-top:16px;background:#fff;border-radius:16px;padding:16px;box-shadow:var(--shadow-sm)}.profile-card h3{margin-top:0}.progress-list{columns:2;font-size:14px;padding-left:18px}.progress-list .done{color:var(--green)}.progress-list .todo{color:var(--ink-soft)}.profile-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.panel-empty{color:var(--ink-soft)}.gate-btn{position:relative;min-width:200px;overflow:hidden;display:inline-flex;align-items:center;justify-content:center}.gate-fill{position:absolute;left:0;top:0;bottom:0;background:#ffffff80;transition:width .08s linear}.gate-label{position:relative;z-index:1;font-weight:800}.star-toast{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);background:var(--accent-2);color:var(--ink);font-weight:800;padding:16px 28px;border-radius:var(--radius-md);box-shadow:var(--shadow);z-index:30;animation:bump 1.4s ease forwards;display:inline-flex;align-items:center;gap:10px;font-size:clamp(20px,3.4vw,28px);white-space:nowrap}.star-toast-tier-1{background:var(--accent-2);color:var(--ink)}.star-toast-tier-2{background:#c0c4c8;color:var(--ink)}.star-toast-tier-3{background:var(--blue);color:#fff}.star-toast-tier-4{background:linear-gradient(135deg,#ffd166,#ff9a3c);color:var(--ink)}.star-toast-emoji{font-size:clamp(28px,5vw,40px);animation:pulse .9s ease infinite}.star-toast-text{font-weight:800}.star-toast-fly{position:absolute;font-size:clamp(20px,3.4vw,28px);pointer-events:none;animation:star-fly 1.4s ease-out forwards}.star-toast-fly-2{animation-delay:.15s}@keyframes star-fly{0%{opacity:1;transform:translate(0) scale(.5) rotate(0)}60%{opacity:1}to{opacity:0;transform:translate(60px,-120px) scale(1.2) rotate(180deg)}}@keyframes bump{0%{transform:translate(-50%,-50%) scale(.4);opacity:0}20%{transform:translate(-50%,-50%) scale(1.18);opacity:1}60%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(.95);opacity:0}}@keyframes page-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,to{transform:translateY(0)}40%{transform:translateY(-14px)}70%{transform:translateY(-6px)}}.bounce{animation:bounce .5s ease}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}.shake{animation:shake .4s ease}@keyframes shake-soft{0%,to{transform:translate(0)}20%{transform:translate(-4px)}60%{transform:translate(4px)}80%{transform:translate(-2px)}}.shake-soft{animation:shake-soft .45s ease;border-color:var(--error)!important}@keyframes success-pulse{0%{transform:scale(1);box-shadow:0 0 #4caf50b3}50%{transform:scale(1.08);box-shadow:0 0 0 12px #4caf5000}to{transform:scale(1);box-shadow:0 0 #4caf5000}}.success-flash{animation:success-pulse .6s ease;background:var(--success-bg)!important}@keyframes pop{0%{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}.pop{animation:pop .3s ease}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.12)}}.playing{animation:pulse .9s ease infinite}.panel-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#2818108c;display:flex;align-items:center;justify-content:center;padding:calc(16px + var(--safe-top)) calc(16px + var(--safe-right)) calc(16px + var(--safe-bottom)) calc(16px + var(--safe-left));z-index:40;animation:page-in .2s ease both}.panel{background:var(--paper);border-radius:var(--radius-lg);box-shadow:var(--shadow);width:min(560px,100%);max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 32px);overflow:auto}.parent-gate{text-align:center}.parent-gate>p{font-weight:700;margin:12px}.paint{display:flex;flex-direction:column;gap:12px;width:100%;flex:1 1 auto;min-height:0}.paint-tools{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.paint-canvas{display:block;min-height:max(140px,32vh)}.maze{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%}.maze-grid{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(5,1fr);gap:0;width:min(380px,100%);max-width:min(380px,100%);max-height:min(380px,calc(100dvh - 240px));aspect-ratio:1 / 1;background:#fff8ee;border-radius:16px;padding:6px;box-shadow:var(--shadow-sm);box-sizing:border-box}.maze-cell{display:flex;align-items:center;justify-content:center;font-size:clamp(28px,7vw,44px);background:transparent;border:0 solid #3a2e2a;border-style:solid;cursor:pointer;padding:0;transition:background .12s ease;-webkit-tap-highlight-color:transparent}.maze-cell.trail{background:#ffd9b8}.maze-cell.mouse{background:#fff0b8;animation:pulse .9s ease infinite}.maze-cell.cheese{background:#ffe28a;animation:pulse .9s ease infinite}.flash-hint{animation:flash-hint .55s ease-in-out 2;box-shadow:0 0 0 4px #4caf50,var(--shadow-sm)}@keyframes flash-hint{0%,to{background:var(--card-bg, #fff)}50%{background:#c8f7c5}}@media (orientation: landscape){.page{padding-top:calc(var(--book-pad) + 36px);padding-bottom:calc(var(--book-pad) + 56px)}.navbar{bottom:calc(64px + var(--safe-bottom))}.page-body{padding-bottom:calc(120px + var(--safe-bottom))}}:focus-visible{outline:4px solid var(--blue);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}