*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}html,body,#root{height:100%;width:100%;overflow:hidden;touch-action:none;font-family:Comic Sans MS,Chalkboard SE,Marker Felt,cursive,sans-serif}button{border:none;cursor:pointer;font-family:inherit}.library{height:100%;display:flex;flex-direction:column;background:linear-gradient(135deg,#ffecd2,#fcb69f);overflow:hidden}.library-header{text-align:center;padding:1rem 1rem .5rem;flex-shrink:0}.library-title{font-size:2.2rem;color:#5d4037;text-shadow:0 2px 4px rgba(0,0,0,.1)}.library-sub{font-size:1rem;color:#795548;margin-top:.3rem}.bookshelf{display:flex;flex-direction:column;gap:.8rem;padding:.8rem 1.2rem 1rem;flex:1;min-height:0}.book-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;border-radius:20px;box-shadow:0 4px 16px #0000002e,inset 0 1px #ffffff4d;transition:transform .15s;flex:1;min-height:0;overflow:hidden;padding:.3rem .5rem}.book-card:active{transform:scale(.93)}.coming-soon-card{background:#ffffff59;box-shadow:0 2px 8px #00000014,inset 0 1px #fff6;border:2px dashed rgba(93,64,55,.25);pointer-events:none}.coming-soon-card .book-card-title{color:#5d4037;opacity:.5;font-size:1.2rem;text-shadow:none}.coming-soon-card .book-cover-emoji{opacity:.4}.book-cover-emoji{font-size:3rem;line-height:1;flex-shrink:1}.book-card-title{font-size:1.3rem;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3);line-height:1.1;flex-shrink:0}.reader{height:100%;display:flex;flex-direction:column;background:#fff8f0;position:relative}.reader-header{display:flex;align-items:center;justify-content:space-between;padding:.6rem 1rem;background:#ffffffe6;border-bottom:1px solid rgba(0,0,0,.06)}.back-btn{font-size:1rem;font-weight:700;color:#5d4037;background:none;padding:.4rem .8rem;border-radius:8px}.back-btn:active{background:#0000000d}.page-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.5rem;padding:1rem 2rem;transition:background .3s ease;position:relative;overflow:hidden}.page-img{width:70%;max-width:380px;object-fit:contain;border-radius:0;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));animation:popIn .3s ease-out;flex:1 1 0;min-height:0}.page-img-abc{width:40%;max-width:250px;filter:drop-shadow(0 6px 16px rgba(0,0,0,.2));background:none;box-shadow:none;border-radius:0}.page-emoji{font-size:5rem;line-height:1;transform:scale(1.8);transform-origin:center;margin:1rem 0;animation:popIn .3s ease-out}.page-emoji-big{font-size:5rem;line-height:1;transform:scale(3);transform-origin:center;margin:2rem 0;animation:popIn .3s ease-out}.page-text{display:flex;flex-direction:column;align-items:center;gap:.2rem;flex-shrink:0}.page-title{font-size:4.5rem;font-weight:700;color:#333;text-shadow:0 2px 4px rgba(0,0,0,.1);animation:slideUp .3s ease-out}.page-title-vehicles{font-size:2.2rem;color:#5d4037!important}.page-subtitle{font-size:2.2rem;color:#666;text-align:center;animation:fadeIn .4s ease-out}.page-subtitle-big{font-size:2.6rem}.section-layout{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;gap:1rem}.section-emoji{width:14rem;height:14rem;object-fit:contain;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));animation:popIn .3s ease-out}.section-title{font-size:2.5rem;font-weight:700;color:#5d4037;text-shadow:0 2px 4px rgba(0,0,0,.1);animation:slideUp .3s ease-out}.abc-layout{justify-content:center;gap:.8rem}.abc-title{display:flex;flex-direction:column;align-items:center;line-height:.9}.abc-lower{font-size:.7em;opacity:.7}.shape-layout{display:flex;flex-direction:column;align-items:center;gap:.5rem;width:100%;height:100%;justify-content:flex-start;padding-top:.5rem}.shape-center{display:flex;align-items:center;justify-content:center;animation:popIn .3s ease-out}.shape-layout .page-title{font-size:3.5rem}.shape-triangle-row{display:flex;align-items:flex-end;justify-content:center;gap:1rem;width:95%;animation:popIn .3s ease-out}.shape-svg{width:20rem;height:20rem;flex-shrink:0}.shape-svg-small{width:11rem;height:11rem;flex-shrink:0}.color-layout{display:flex;flex-direction:column;align-items:center;gap:.3rem;width:100%;height:100%;justify-content:flex-start;padding-top:.5rem}.color-swatch-wrap{animation:popIn .3s ease-out}.color-swatch{width:16rem;height:16rem;flex-shrink:0}.color-example{width:12rem;height:12rem;flex-shrink:0;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15));animation:slideUp .3s ease-out}.color-rainbow{width:18rem;height:18rem;filter:drop-shadow(0 4px 12px rgba(0,0,0,.15));animation:popIn .3s ease-out}.color-title{font-size:3.5rem}.number-layout{display:flex;flex-direction:column;align-items:center;gap:.5rem;width:100%;height:100%;justify-content:center}.number-objects{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;max-width:90%;animation:popIn .3s ease-out;align-content:center}.number-object{width:5rem;height:5rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15))}.number-obj-count-1{width:12rem;height:12rem}.number-obj-count-2{width:9rem;height:9rem}.number-obj-count-3{width:8rem;height:8rem}.number-obj-count-4{width:7rem;height:7rem}.number-obj-count-5{width:6.5rem;height:6.5rem}.number-obj-count-6{width:5.5rem;height:5.5rem}.number-obj-count-7{width:5rem;height:5rem}.number-object-highlight{animation:countBounce .5s ease-out forwards;filter:drop-shadow(0 0 12px rgba(255,200,0,.8)) drop-shadow(0 0 24px rgba(255,150,0,.5));z-index:1}@keyframes countBounce{0%{transform:scale(1)}30%{transform:scale(1.35)}60%{transform:scale(.95)}to{transform:scale(1.15)}}.number-digit{font-size:8rem;font-weight:700;line-height:1;text-shadow:0 4px 12px rgba(0,0,0,.15)}.number-word{font-size:2rem;font-weight:700;color:inherit;opacity:.7}.summary-layout{display:flex;flex-direction:column;align-items:center;justify-content:stretch;width:100%;height:100%;flex:1;min-height:0}.summary-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.4rem;width:92%;max-width:500px;animation:popIn .3s ease-out;flex:1;min-height:0}.summary-grid-abc{grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(5,1fr);gap:.4rem;height:100%;width:95%;max-width:none}.summary-item{display:flex;align-items:center;justify-content:center;aspect-ratio:1;font-size:2.5rem;font-weight:700;color:#5d4037;background:#fff9;border-radius:12px;box-shadow:0 2px 6px #0000001a;cursor:pointer;transition:transform .1s}.summary-item:active{transform:scale(.9);background:#ffffffe6}.summary-grid-numbers{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(5,1fr);gap:.5rem;height:100%;width:88%}.summary-item-number{aspect-ratio:auto;font-size:8rem;border-radius:16px;text-shadow:0 2px 4px rgba(0,0,0,.1)}.summary-item-number:active{transform:scale(.9)}.summary-item-abc{aspect-ratio:auto;font-size:2.8rem;border-radius:14px;text-shadow:0 1px 2px rgba(0,0,0,.1)}.summary-item-abc:active{transform:scale(.9)}.summary-grid-colors{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(5,1fr);gap:.5rem;height:100%;width:88%}.summary-item-color{aspect-ratio:auto;border-radius:16px}.summary-item-color:active{transform:scale(.9)}.summary-grid-shapes{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,1fr);gap:.4rem;height:100%;width:95%;max-width:none}.summary-item-shape{aspect-ratio:auto;padding:.3rem;border-radius:12px}.summary-item-shape .shape-svg{width:100%;height:100%}.summary-item-shape:active{transform:scale(.9)}.summary-grid-emoji{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(5,1fr);gap:.5rem;height:100%;width:92%;max-width:none}.summary-grid-vehicles{grid-template-columns:repeat(3,1fr);gap:.5rem;height:100%;width:92%;max-width:none}.summary-item-emoji{aspect-ratio:auto;padding:.3rem;border-radius:12px}.summary-emoji-img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15))}.summary-item-emoji:active{transform:scale(.9)}.speak-controls{position:absolute;bottom:1rem;right:1rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;touch-action:manipulation;z-index:10}.speak-btn{font-size:1.8rem;background:#fffc;border-radius:50%;width:52px;height:52px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #00000026;transition:transform .1s,opacity .2s;touch-action:manipulation}.speak-btn:active{transform:scale(.9)}.volume-slider{writing-mode:vertical-lr;direction:rtl;width:6px;height:80px;-webkit-appearance:none;appearance:none;background:#00000026;border-radius:3px;outline:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#5d4037;cursor:pointer;box-shadow:0 1px 4px #0003}.tappable{cursor:pointer}@keyframes popIn{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.reader-nav{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:#fffffff2;border-top:1px solid rgba(0,0,0,.06);touch-action:manipulation}.nav-btn{font-size:1.4rem;background:#5d40371a;color:#5d4037;border-radius:12px;width:52px;height:44px;display:flex;align-items:center;justify-content:center;transition:transform .1s,opacity .2s;touch-action:manipulation}.nav-btn:active{transform:scale(.9);background:#5d403733}.nav-btn:disabled{opacity:.2;pointer-events:none}.nav-page-indicator{font-size:1rem;font-weight:700;color:#999;background:none;padding:.4rem 1rem;border-radius:8px;touch-action:manipulation}.nav-page-indicator:active{background:#0000000d}.page-picker-overlay{position:absolute;inset:0;background:#00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;padding:1.5rem}.page-picker{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:320px;max-height:60vh;overflow-y:auto;padding:1rem;background:#fffffff2;border-radius:16px;box-shadow:0 8px 32px #0003}.page-picker-item{width:44px;height:44px;border-radius:50%;background:#5d40371a;color:#5d4037;font-size:1rem;font-weight:700;display:flex;align-items:center;justify-content:center;transition:transform .1s}.page-picker-item:active{transform:scale(.9)}.page-picker-active{background:#5d4037;color:#fff}.page-picker-close{margin-top:1rem;padding:.6rem 2rem;background:#ffffffe6;color:#5d4037;font-size:1rem;font-weight:700;border-radius:12px;box-shadow:0 2px 8px #00000026}.page-picker-close:active{transform:scale(.95)}@media(max-width:480px){.library-title{font-size:1.8rem}.bookshelf{gap:.6rem;padding:.6rem}.book-cover-emoji{font-size:2.2rem}.book-card-title{font-size:1.1rem}.page-img{width:65%;max-width:280px}.page-emoji{font-size:5rem;transform:scale(1.4)}.page-emoji-big{font-size:5rem;transform:scale(2.4);margin:1.5rem 0}.page-title{font-size:3.5rem}.page-title-vehicles{font-size:1.8rem}.page-subtitle{font-size:1.6rem}.page-subtitle-big{font-size:2rem}.number-object{width:3.5rem;height:3.5rem}.number-obj-count-1{width:9rem;height:9rem}.number-obj-count-2{width:7rem;height:7rem}.number-obj-count-3{width:6rem;height:6rem}.number-obj-count-4{width:5.5rem;height:5.5rem}.number-obj-count-5{width:5rem;height:5rem}.number-obj-count-6{width:4.5rem;height:4.5rem}.number-obj-count-7{width:4rem;height:4rem}.number-digit{font-size:6rem}.number-word{font-size:1.5rem}.summary-item{font-size:1.8rem}.summary-item-abc{font-size:2rem}.shape-svg{width:15rem;height:15rem}.shape-svg-small{width:9rem;height:9rem}.color-swatch{width:12rem;height:12rem}.color-example{width:9rem;height:9rem}.color-rainbow{width:14rem;height:14rem}.color-title{font-size:3rem}.nav-btn{width:44px;height:40px;font-size:1.2rem}}@media(min-width:768px){.bookshelf{max-width:600px;margin:0 auto}.book-cover-emoji{font-size:5rem}.book-card-title{font-size:2rem}.page-img{width:60%;max-width:430px}.page-emoji{font-size:5rem;transform:scale(2.4)}.page-emoji-big{font-size:5rem;transform:scale(4);margin:3rem 0}.page-title{font-size:7rem}.page-title-vehicles{font-size:3rem}.page-subtitle{font-size:2.8rem}.page-subtitle-big{font-size:3.2rem}.number-object{width:6rem;height:6rem}.number-obj-count-1{width:16rem;height:16rem}.number-obj-count-2{width:12rem;height:12rem}.number-obj-count-3{width:10rem;height:10rem}.number-obj-count-4{width:9rem;height:9rem}.number-obj-count-5{width:8rem;height:8rem}.number-obj-count-6{width:7rem;height:7rem}.number-obj-count-7{width:6.5rem;height:6.5rem}.number-digit{font-size:10rem}.number-word{font-size:2.5rem}.summary-item{font-size:3.5rem}.summary-item-abc{font-size:3.8rem}.page-img-abc{width:45%;max-width:320px}.shape-svg{width:26rem;height:26rem}.shape-svg-small{width:14rem;height:14rem}.color-swatch{width:22rem;height:22rem}.color-example{width:16rem;height:16rem}.color-rainbow{width:24rem;height:24rem}.color-title{font-size:5rem}}