:root{--pine:#194e43;--mint:#c7e9d5;--cream:#fff9e9;--orange:#f7b649;--shadow:0 12px 35px #285c3c20;--p:0%;--voice:0}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:system-ui,Tahoma,sans-serif;color:var(--pine);background:#f3f7ee}body{line-height:1.5}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;border:0}button:disabled{cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:4px solid #de8e29;outline-offset:4px}[hidden]{display:none!important}.icon{width:24px;height:24px;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.round{width:46px;height:46px;border-radius:16px;background:#fffdf2e8;border:1px solid #fff;box-shadow:0 4px 0 #2254411a;display:grid;place-items:center}.round:active{transform:translateY(2px)}.pill{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 24px;border-radius:22px;font-weight:850;background:#fff;border:1px solid #d9e4d4}.brand{font-size:18px;font-weight:950;letter-spacing:.01em;direction:ltr}.brand small{display:block;font-size:9px;letter-spacing:.15em;font-weight:650;color:#6d8374}.home{max-width:1100px;margin:auto;padding:20px 22px}.home-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:19px}.nav-actions{display:flex;align-items:center;gap:10px}.score{display:flex;align-items:center;gap:7px;font-weight:850;padding:8px 15px;border-radius:30px;background:#fff3cd;border:1px solid #f3d99b}.score .icon{color:#dca138;fill:#ffc860;width:20px;height:20px}.world-card{position:relative;min-height:365px;isolation:isolate;overflow:hidden;border-radius:34px;box-shadow:var(--shadow);background:url('/kids-art/garden.webp') center 60%/cover;border:3px solid #fff}.world-card:before{content:'';position:absolute;inset:0;background:linear-gradient(270deg,#fbfff4f0 0,#f8fff1d9 30%,#eff8e91a 70%);z-index:-1}.welcome-copy{position:relative;width:55%;padding:40px 35px 50px}.eyebrow{font-size:11px;letter-spacing:.08em;color:#61846e;font-weight:850}.welcome-copy h1{font-size:clamp(33px,4.6vw,52px);line-height:1.14;letter-spacing:-1.5px;margin:12px 0}.welcome-copy p{font-size:15px;color:#52705e;margin:0 0 23px}.start-button{background:#f7bd53;color:#533d1e;border:2px solid #e1a53b;border-radius:24px;min-width:175px;padding:16px 23px;box-shadow:0 6px 0 #ce9637;display:inline-flex;align-items:center;gap:17px;font-weight:900;font-size:21px}.start-button .icon{width:29px;height:29px;fill:currentColor;stroke:none}.start-button:active{transform:translateY(4px);box-shadow:0 2px 0 #ce9637}.hero-dino{position:absolute;left:1%;bottom:15px;width:46%;height:93%;object-fit:contain;filter:drop-shadow(0 15px 7px #2c5b3026);animation:idle 4s ease-in-out infinite}.hero-float{position:absolute;left:10%;top:21px;background:#fffcdf;box-shadow:0 4px 20px #71542714;border:2px solid #fff3c3;border-radius:30px;padding:7px 14px;transform:rotate(-9deg);font-size:13px;font-weight:850}.hero-float .icon{fill:#ffcc55;stroke:#d39536}.home-section-head{display:flex;justify-content:space-between;align-items:baseline;margin:28px 1px 13px}.home-section-head h2{margin:0;font-size:21px}.home-section-head span{font-size:12px;color:#738978}.chapters{display:grid;grid-template-columns:repeat(5,1fr);gap:13px}.chapter{background:#fffdf6;padding:18px 11px;border:2px solid #e0e9d9;box-shadow:0 6px 0 #dbe5d4;border-radius:23px;text-align:center;transition:transform .2s}.chapter:hover{transform:translateY(-4px)}.chapter .chapter-picture{width:60px;height:60px;display:grid;place-items:center;margin:0 auto 10px;background:var(--card-bg,#e2f2df);border-radius:20px}.chapter .chapter-picture .icon{width:36px;height:36px;stroke-width:1.5}.chapter strong{font-size:16px;display:block}.chapter .mini-stars{display:flex;justify-content:center;gap:2px;margin-top:10px;direction:ltr}.mini-stars .icon{width:13px;height:13px;stroke:#d6d4bc}.mini-stars .filled{fill:#f3c254;stroke:#c99c3b}.home-bottom{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:26px}.bag-card,.song-card{border:1px solid #dde7d4;border-radius:24px;padding:20px;background:#e6f1e0;min-height:113px}.bag-card h3,.song-card h3{margin:0 0 9px;font-size:15px}.bag-content{font-size:24px;min-height:38px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.bag-empty{font-size:13px;color:#71836c}.song-card{background:#eee7f5;display:flex;align-items:center;justify-content:space-between;gap:10px}.song-card p{font-size:12px;margin:0;color:#7c6b8e}.song-card button{width:49px;height:49px;flex-shrink:0;border-radius:17px;background:#fff;color:#82609e}.song-card button .icon{fill:currentColor;stroke:none}.home-footer{text-align:center;font-size:11px;color:#84917f;margin:25px 0 10px}.home-footer a{margin:0 6px;text-decoration:underline}
body.playing{overflow:hidden;overscroll-behavior:none}.game{position:fixed;inset:0;z-index:10;height:100vh;height:100dvh;background:#cce4ba url('/kids-art/garden.webp') center/cover;overflow:hidden;isolation:isolate}.game:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#f4fff4d9 0,#fff9ec12 33%,#edf3d700 62%,#eaf2dfde 100%)}.game-wrap{max-width:1080px;height:100%;margin:auto;padding:calc(10px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));display:grid;grid-template-rows:50px auto minmax(0,1fr) 130px;gap:9px}.hud{display:grid;grid-template-columns:46px 1fr 46px;gap:14px;align-items:center;direction:ltr}.route{display:flex;align-items:center;justify-content:center;gap:0;direction:ltr;max-width:290px;width:100%;margin:auto}.route-node{position:relative;width:39px;height:39px;border:2px solid #e5d8ab;background:#fff9e6;border-radius:50%;display:grid;place-items:center;color:#d7cb9f;box-shadow:0 3px 0 #4d6a3014;flex-shrink:0;transition:.4s}.route-node .icon{width:23px;height:23px}.route-node.active{background:#ffeab0;border-color:#d8a03f;color:#bd8528;box-shadow:0 0 0 5px #fff2c4aa}.route-node.done{background:#ffc95f;border-color:#d49d38;color:#a67421}.route-node.done .icon{fill:#fff6ce}.route-line{width:34px;height:4px;border-radius:10px;background:#fff9dfbb;position:relative}.route-line.done{background:#ebba4f}.goal-node{margin-left:11px;position:relative;width:42px;height:42px;border-radius:14px;background:#faf7e1;color:#987947;display:grid;place-items:center;box-shadow:0 4px 0 #5c70471c}.goal-node .icon{width:30px;height:30px}.verse-card{width:min(100%,760px);margin:auto;background:#fffcf0ee;border:2px solid #fff;border-radius:23px;padding:10px 17px;text-align:center;box-shadow:0 5px 20px #284a2910;max-height:22dvh;overflow:auto;scrollbar-width:thin;backdrop-filter:blur(7px);position:relative;z-index:5}.verse-meta{display:flex;justify-content:center;align-items:center;gap:9px;font-size:10px;font-weight:750;color:#7d8c72;margin-bottom:4px}.verse-meta i{width:3px;height:3px;border-radius:50%;background:#acb99c}.ayah{font-family:Amiri,'Traditional Arabic',serif;font-size:clamp(24px,3.7vh,35px);line-height:1.6;font-weight:700;margin:0;unicode-bidi:plaintext;color:#284b37}.scene{position:relative;min-height:0;isolation:isolate;overflow:visible}.dino-anchor{position:absolute;bottom:8%;left:48%;transform:translateX(-50%);height:min(77%,300px);aspect-ratio:1.094;z-index:3;transition:height .5s,bottom .5s}.dino-mover{width:100%;height:100%;transform-origin:center 85%;position:relative}.dino-image{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 9px #365a2c2a);animation:idle 3.6s ease-in-out infinite;user-select:none;-webkit-user-drag:none;pointer-events:none}.aura{position:absolute;inset:17% 10% 4%;border-radius:50%;z-index:-1;opacity:0;background:radial-gradient(#eafedf99,#cbf1bb00 72%);transform:scale(calc(.9 + var(--voice)*.3));transition:opacity .2s,transform .12s}.is-recording .aura{opacity:1}.is-recording .dino-image{animation:anticipate 1.6s ease-in-out infinite}.is-listening .dino-image{animation:listen 2s ease-in-out infinite}.dino-ground{position:absolute;width:38%;height:6%;background:#28572a1a;filter:blur(7px);border-radius:50%;left:48%;bottom:7%;transform:translateX(-50%);transition:opacity .3s}.scene-caption{position:absolute;top:0;left:50%;transform:translateX(-50%);white-space:nowrap;max-width:95%;overflow:hidden;text-overflow:ellipsis;text-align:center;padding:6px 15px;border:1px solid #fff6cc;border-radius:22px;background:#fffbeaee;box-shadow:0 3px 20px #5a78301a;font-size:13px;font-weight:800;z-index:6}.scene-caption .icon{width:17px;height:17px;margin-left:5px}.prop-water{position:absolute;bottom:13%;left:5%;width:90%;height:17%;border-radius:50%;background:linear-gradient(#79ccbc,#bae7ce);border:4px solid #d6efd6;box-shadow:0 5px 0 #8dbd9b66;opacity:.85;transform:rotate(-4deg);z-index:-1;transition:.5s}.prop-water:after{content:'';position:absolute;inset:30% 12%;border-top:2px dashed #e6fff5;border-bottom:2px dashed #e6fff5;border-radius:50%;opacity:.8}.stepping-stones{position:absolute;bottom:15%;left:25%;display:flex;gap:40px;transform:rotate(-4deg);z-index:0}.stepping-stones i{width:40px;height:20px;background:linear-gradient(#d4d8b4,#abb293);border-radius:50%;box-shadow:0 4px 0 #8f9f7c}.scene[data-challenge='1'] .prop-water,.scene[data-challenge='2'] .prop-water,.scene[data-challenge='1'] .stepping-stones,.scene[data-challenge='2'] .stepping-stones{opacity:0}.butterflies{position:absolute;inset:10% 0 0;pointer-events:none;opacity:0;transition:.4s}.butterflies span{position:absolute;left:15%;top:35%;font-size:35px;animation:butterfly 5s ease-in-out infinite}.butterflies span:nth-child(2){left:79%;top:20%;font-size:27px;animation-delay:-2s}.scene[data-challenge='1'] .butterflies{opacity:1}.balloon{position:absolute;left:8%;top:-21%;width:36%;height:60%;opacity:0;pointer-events:none;transform:rotate(-10deg)}.balloon:before{content:'';position:absolute;left:12%;top:0;width:79%;height:57%;background:radial-gradient(circle at 30% 25%,#fff1b9,#f6ad86 72%);border:2px solid #e79b77;border-radius:50% 50% 48% 48%;box-shadow:inset -8px -6px 0 #d8957020}.balloon:after{content:'';position:absolute;top:56%;left:48%;height:44%;border-left:2px solid #b68f61}.motion-float .balloon{opacity:1}.collect-star{position:absolute;right:5%;top:22%;width:77px;height:77px;z-index:8;border:0;background:none;padding:0;filter:drop-shadow(0 7px 4px #9e7b3126);animation:star-float 1.6s ease-in-out infinite}.collect-star .icon{width:100%;height:100%;stroke:#d99c30;stroke-width:1.1;fill:#ffd870}.collect-star:before{content:'';position:absolute;inset:-10px;border:2px solid #fff4b8;border-radius:50%;animation:target-ring 1.6s ease-out infinite}.touch-hand{position:absolute;right:-9px;bottom:-32px;font-size:32px;transform:rotate(-25deg);animation:point .8s ease-in-out infinite;filter:drop-shadow(0 2px 1px #4a4b3926)}.collect-star:active{transform:scale(.92)}.celebration{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:visible}.celebration span{position:absolute;left:50%;top:45%;font-size:25px;opacity:0;animation:confetti 2.4s ease-out forwards}.celebration .icon{width:29px;height:29px;fill:var(--color);stroke:#fff9;stroke-width:1}.scene.is-celebrating .scene-caption{background:#fff3ba;font-size:16px}.motion-hop{animation:hop 2.2s ease-in-out both}.motion-float{animation:float-adventure 2.2s ease-in-out both}.motion-dance{animation:dance 2.2s ease-in-out both}.motion-spin{animation:spin 2.2s ease-in-out both}.motion-bounce{animation:bounce 2.2s ease-in-out both}.motion-happy{animation:happy 2.2s ease-in-out both}.scene.is-celebrating .dino-image{animation:none}.scene.is-celebrating .dino-ground{opacity:.35}.dock{position:relative;z-index:9;width:min(100%,450px);height:130px;margin:auto;background:#fffdf3ed;border:2px solid #fff;border-radius:30px;box-shadow:0 8px 28px #3a5a2d1f;display:grid;grid-template-columns:56px 1fr 56px;align-items:center;padding:12px 19px 9px;gap:10px;backdrop-filter:blur(9px);direction:ltr}.dock-secondary{width:48px;height:48px;border-radius:17px;background:#eaf0df;border:1px solid #d9e5cf;display:grid;place-items:center;color:#698766}.dock-secondary .icon{width:24px;height:24px}.dock-secondary:disabled{opacity:.35}.main-action{border-radius:50%;width:78px;height:78px;display:grid;place-items:center;border:4px solid #fff9dc;background:linear-gradient(145deg,#ffdc7d,#f8bc50);color:#66441f;box-shadow:0 5px 0 #cb9638,0 0 0 5px #f3e5b7;position:relative;margin:auto;transition:background .2s}.main-action:before{content:'';position:absolute;inset:-7px;border-radius:50%;background:conic-gradient(#73b68f var(--p),transparent 0);z-index:-1}.main-action .icon{width:36px;height:36px;stroke-width:2}.main-action[data-mode='ready'],.main-action[data-mode='recording']{background:linear-gradient(145deg,#bcead0,#8cccae);box-shadow:0 5px 0 #629e7e,0 0 0 5px #d6e8ce;color:#205b45}.main-action[data-mode='recording']{animation:mic-pulse 1.1s infinite}.main-action[data-mode='next'],.main-action[data-mode='complete']{background:linear-gradient(145deg,#d9caf4,#b5a0df);box-shadow:0 5px 0 #9880be,0 0 0 5px #ece2f4;color:#5d4283}.main-action:active{transform:translateY(3px);box-shadow:0 2px 0 #b28c4c}.main-action:disabled{opacity:.75}.main-control{text-align:center;align-self:center}.action-label{font-size:12px;font-weight:850;margin-top:10px;color:#768365;direction:rtl;line-height:1.2}.control-hint{position:absolute;top:-33px;left:50%;transform:translateX(-50%);background:#fffcf1f0;border:1px solid #fff;border-radius:18px;padding:5px 15px;max-width:95%;width:max-content;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;font-weight:750;color:#5b7454;box-shadow:0 3px 15px #5370390c}.sound-bars{display:flex;gap:3px;align-items:center;justify-content:center;position:absolute;bottom:15%;left:50%;transform:translateX(-50%);height:25px;z-index:4;opacity:0;pointer-events:none}.sound-bars i{display:block;width:5px;background:#fff5cf;border-radius:5px;height:calc(5px + var(--voice)*22px);box-shadow:0 1px 3px #61865033;transition:height .12s}.sound-bars i:nth-child(2n){height:calc(5px + var(--voice)*13px)}.is-recording .sound-bars{opacity:1}.gift-panel{position:absolute;left:50%;bottom:2%;transform:translateX(-50%);background:#fff6d8f2;border:2px solid #fff8e5;border-radius:27px;padding:12px 20px 15px;z-index:9;box-shadow:0 12px 28px #47602f24;width:min(95%,340px);text-align:center}.gift-panel h2{font-size:17px;margin:0 0 9px}.egg-row{display:flex;gap:14px;justify-content:center;direction:ltr}.egg-button{position:relative;background:none;width:76px;height:91px;border:0;padding:0}.egg-shape{display:block;position:absolute;inset:6px 5px 4px;border-radius:50% 50% 46% 46%/60% 60% 40% 40%;background:radial-gradient(circle at 32% 24%,#fffef0 0,#fff7ca 42%,#e3c889 100%);border:2px solid #d7b981;box-shadow:inset -6px -4px 0 #d7bf841a,0 7px 0 #9d9a6320;transform-origin:center bottom;animation:egg-wobble 3s ease-in-out infinite}.egg-button:nth-child(2) .egg-shape{background:radial-gradient(circle at 32% 24%,#f2fffc,#cceddd 50%,#9ac9b0);border-color:#8bb7a2;animation-delay:-1s}.egg-button:nth-child(3) .egg-shape{background:radial-gradient(circle at 32% 24%,#fff6ff,#eadbf5 50%,#c5a5dc);border-color:#bd9ad3;animation-delay:-2s}.egg-shape:after{content:'';position:absolute;width:13px;height:18px;top:20%;left:27%;border-radius:50%;background:#fff9;transform:rotate(30deg)}.egg-shape .icon{position:absolute;top:45%;left:29%;width:24px;height:24px;color:#b1985c;opacity:.45;fill:#fff9}.is-gift .dino-anchor{height:min(55%,215px);bottom:34%}.is-gift .scene-caption{top:-4px}.gift-reveal{position:absolute;left:50%;top:9%;transform:translateX(-50%);font-size:70px;z-index:10;animation:reveal .7s cubic-bezier(.2,1.6,.4,1)}.world-finish{position:absolute;inset:0;z-index:12;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(#fff9d3de,#f9ffeac4);border-radius:30px;text-align:center;padding:20px}.world-finish .icon{width:64px;height:64px;fill:#f9ce69;stroke:#be913c}.world-finish h2{font-size:25px;line-height:1.4;margin:12px 0 5px}.world-finish p{font-size:14px;margin:0 0 15px;color:#798263}.world-finish img{height:120px;object-fit:contain;margin-bottom:8px}.world-finish .pill{background:#ffd271;border:2px solid #e2b24a;box-shadow:0 4px 0 #c69a3f;min-width:150px}
.sheet-backdrop{position:absolute;inset:0;background:#17382b75;z-index:40;display:grid;place-items:center;padding:18px;backdrop-filter:blur(5px)}.parent-sheet{background:#fffcf0;border:2px solid white;border-radius:29px;box-shadow:0 25px 100px #142d3366;width:min(100%,550px);max-height:90dvh;overflow:auto;padding:23px;color:#355c45;text-align:right}.parent-sheet header{display:flex;justify-content:space-between;align-items:center}.parent-sheet h2{font-size:21px;margin:0}.parent-sheet .round{box-shadow:none;background:#ecf1e5}.parent-sheet p{font-size:13px;line-height:1.9;color:#72816a}.parent-sheet h3{font-size:15px;margin:20px 0 9px}.settings-row{display:flex;gap:8px;flex-wrap:wrap}.settings-row button{padding:10px 15px;border-radius:15px;background:#e8efdf;border:2px solid transparent;font-size:13px}.settings-row button[aria-pressed='true']{border-color:#8db69b;background:#d1e8d4;font-weight:850}.parent-note{border-top:1px solid #e3e7d8;padding-top:13px}.settings-nav{display:flex;gap:10px;margin-top:20px}.settings-nav .pill{padding:10px 15px;font-size:13px;min-height:46px}.nasheed{max-width:760px;margin:auto;padding:24px;text-align:center}.nasheed .video{aspect-ratio:16/9;border-radius:28px;overflow:hidden;background:#e8e1f0;margin:25px 0}.nasheed iframe{width:100%;height:100%;border:0}.nasheed h1{font-size:30px}.nasheed .lyrics{font-size:24px;line-height:2}.nasheed .pill{background:#ece3f4}
@keyframes idle{50%{transform:translateY(-5px) rotate(-1deg)}}@keyframes listen{50%{transform:rotate(-3deg) scale(1.015)}}@keyframes anticipate{50%{transform:translateY(-3px) scale(1.025)}}@keyframes butterfly{25%{transform:translate(15px,-15px) rotate(12deg)}70%{transform:translate(-10px,8px) rotate(-8deg)}}@keyframes star-float{50%{transform:translateY(-8px) rotate(5deg)}}@keyframes target-ring{0%{transform:scale(.8);opacity:.8}100%{transform:scale(1.4);opacity:0}}@keyframes point{50%{transform:translate(-5px,-6px) rotate(-25deg)}}@keyframes mic-pulse{50%{filter:brightness(1.08)}}@keyframes hop{0%,100%{transform:translate(0)}16%{transform:scale(1.05,.9) translateY(6px)}45%{transform:translate(30px,-52px) rotate(8deg)}70%{transform:translate(45px,-14px) rotate(-5deg)}85%{transform:translate(20px,2px) scale(1.04,.95)}}@keyframes float-adventure{0%,100%{transform:translate(0)}30%{transform:translate(-25px,-28px) rotate(-7deg)}65%{transform:translate(30px,-45px) rotate(8deg)}85%{transform:translate(12px,-15px)}}@keyframes dance{0%,100%{transform:translate(0)}20%,60%{transform:translate(-22px,-5px) rotate(-10deg)}40%,80%{transform:translate(22px,-9px) rotate(10deg)}}@keyframes spin{0%,100%{transform:rotate(0)}25%{transform:translateY(-15px) rotate(-10deg)}70%{transform:translateY(-23px) rotate(360deg)}90%{transform:rotate(365deg)}}@keyframes bounce{0%,100%{transform:scale(1)}20%,60%{transform:translateY(-40px) scale(.96,1.05)}40%,80%{transform:scale(1.08,.92)}}@keyframes happy{0%,100%{transform:scale(1)}30%{transform:rotate(-7deg) scale(1.08)}70%{transform:rotate(7deg) scale(1.08)}}@keyframes confetti{0%{opacity:0;transform:scale(.3)}15%,75%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r))}}@keyframes egg-wobble{0%,65%,100%{transform:rotate(0)}72%,88%{transform:rotate(-6deg)}80%,94%{transform:rotate(6deg)}}@keyframes reveal{0%{transform:translateX(-50%) scale(.2) rotate(-15deg)}100%{transform:translateX(-50%) scale(1) rotate(0)}}
@media(max-width:650px){.home{padding:15px}.brand{font-size:16px}.brand small{font-size:8px}.score{padding:7px 11px;font-size:14px}.home-nav .round{width:39px;height:39px;border-radius:14px}.nav-actions{gap:7px}.world-card{min-height:410px;border-radius:28px;background-position:57% center}.world-card:before{background:linear-gradient(180deg,#f9fff2eb 0,#f6ffe3b8 35%,#eaf4da00 68%)}.welcome-copy{text-align:center;width:100%;padding:22px 20px 0;z-index:4;pointer-events:none}.welcome-copy button{pointer-events:auto}.welcome-copy h1{font-size:33px;max-width:290px;margin:8px auto 6px}.welcome-copy p{font-size:12px;margin-bottom:13px}.eyebrow{font-size:9px}.hero-dino{left:1%;bottom:-20px;width:68%;height:64%;transform-origin:bottom}.hero-float{left:auto;right:16px;top:auto;bottom:35px;font-size:11px;max-width:120px;transform:rotate(7deg);z-index:5}.start-button{position:absolute;top:270px;right:17px;font-size:16px;min-width:135px;padding:12px 17px;border-radius:20px;margin:0}.start-button .icon{width:23px;height:23px}.chapters{grid-template-columns:repeat(2,1fr);gap:12px}.chapter{display:flex;gap:12px;align-items:center;padding:13px 12px;text-align:right;border-radius:21px}.chapter .chapter-picture{width:45px;height:48px;flex-shrink:0;margin:0;border-radius:15px}.chapter .chapter-picture .icon{width:29px;height:29px}.chapter strong{font-size:15px}.chapter .mini-stars{justify-content:flex-start;margin-top:5px;gap:0}.mini-stars .icon{width:11px;height:11px}.chapter:last-child{grid-column:1/-1;justify-content:center}.home-section-head{margin-top:23px}.home-section-head h2{font-size:18px}.home-section-head span{font-size:10px}.home-bottom{grid-template-columns:1fr;gap:12px;margin-top:20px}.bag-card,.song-card{min-height:90px;padding:15px 19px}.game-wrap{padding-top:calc(8px + env(safe-area-inset-top));grid-template-rows:46px auto minmax(0,1fr) 124px;gap:7px}.hud{gap:8px}.hud .round{width:42px;height:42px;border-radius:15px}.route{max-width:255px}.route-node{width:33px;height:33px}.route-node .icon{width:20px;height:20px}.route-line{width:23px}.goal-node{width:34px;height:34px;margin-left:8px;border-radius:12px}.goal-node .icon{width:24px;height:24px}.verse-card{padding:8px 12px;border-radius:20px;max-height:21dvh}.ayah{font-size:clamp(24px,3.5vh,30px);line-height:1.55}.verse-meta{font-size:9px}.scene-caption{font-size:11px;padding:5px 12px}.dino-anchor{height:min(74%,250px);left:47%;bottom:9%}.collect-star{width:60px;height:60px;right:3%;top:22%}.touch-hand{font-size:27px;bottom:-27px}.prop-water{height:15%;bottom:15%}.stepping-stones{left:20%;gap:25px;bottom:16%}.stepping-stones i{width:30px;height:15px}.dock{height:124px;padding:10px 18px 7px;border-radius:28px}.main-action{width:73px;height:73px}.main-action .icon{width:33px;height:33px}.dock-secondary{width:44px;height:44px;border-radius:16px}.action-label{font-size:11px}.control-hint{font-size:11px;top:-31px}.is-gift .dino-anchor{height:min(54%,180px);bottom:37%}.gift-panel{padding:9px 15px 12px;border-radius:24px}.egg-button{height:80px;width:68px}.gift-panel h2{font-size:14px;margin-bottom:5px}.egg-row{gap:12px}.world-finish{padding:12px}.world-finish img{height:95px}.world-finish h2{font-size:20px}.world-finish p{font-size:12px}}
@media(max-height:650px) and (orientation:portrait){.game-wrap{grid-template-rows:40px auto minmax(0,1fr) 111px;gap:5px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.hud .round{height:36px;width:36px}.route-node{width:29px;height:29px}.verse-card{padding:5px 10px;max-height:20dvh}.ayah{font-size:23px;line-height:1.45}.verse-meta{margin-bottom:1px;font-size:8px}.dock{height:111px}.main-action{width:62px;height:62px}.main-action .icon{width:29px;height:29px}.action-label{margin-top:8px;font-size:10px}.dock-secondary{height:39px;width:39px}.control-hint{top:-28px;font-size:10px}.scene-caption{font-size:10px;top:-2px}.dino-anchor{bottom:8%;height:72%}.collect-star{width:48px;height:48px;top:28%}.is-gift .dino-anchor{height:47%;bottom:47%}.is-gift .scene-caption{display:none}.gift-panel{bottom:0;padding:5px 10px 7px;width:255px}.gift-panel h2{font-size:12px;margin-bottom:2px}.egg-button{height:59px;width:53px}.egg-row{gap:12px}.world-finish img{display:none}.world-finish .icon{width:40px;height:40px}.world-finish h2{font-size:18px;margin:6px}.world-finish p{margin-bottom:8px}.world-finish .pill{padding:8px 20px}}
@media(max-height:540px) and (orientation:landscape){.game-wrap{grid-template-columns:minmax(0,1fr) 255px;grid-template-rows:43px minmax(0,1fr);gap:8px;padding-top:max(5px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}.hud{grid-column:1/-1;grid-row:1}.verse-card{grid-column:2;grid-row:2;align-self:start;max-height:calc(100% - 128px);width:100%;padding:7px 10px}.ayah{font-size:21px;line-height:1.5}.verse-meta{font-size:9px}.scene{grid-column:1;grid-row:2}.dock{grid-column:2;grid-row:2;align-self:end;height:108px;width:100%;padding:8px 12px 5px;grid-template-columns:40px 1fr 40px;gap:4px;border-radius:24px}.main-action{width:62px;height:62px}.main-action .icon{width:28px;height:28px}.action-label{margin-top:8px;font-size:10px}.dock-secondary{width:36px;height:36px;border-radius:13px}.dock-secondary .icon{width:20px;height:20px}.control-hint{top:-26px;font-size:10px;max-width:95%;padding:3px 9px}.dino-anchor{height:83%;left:43%;bottom:3%}.scene-caption{left:14%;top:3%;font-size:10px;max-width:45%;padding:4px 9px}.collect-star{width:57px;height:57px;right:3%;top:25%}.is-gift .dino-anchor{height:79%;bottom:5%;left:29%}.gift-panel{left:auto;right:0;bottom:8%;transform:none;width:165px;padding:9px}.gift-panel h2{font-size:12px}.egg-row{gap:3px}.egg-button{width:45px;height:60px}.egg-shape .icon{width:18px;height:18px}.world-finish img{display:none}.world-finish h2{font-size:20px}.world-finish .icon{height:40px;width:40px}}
@media(prefers-reduced-motion:reduce){.dino-image,.hero-dino,.butterflies span,.touch-hand,.main-action,.egg-shape,.collect-star,.collect-star:before{animation:none!important}.motion-hop,.motion-float,.motion-dance,.motion-spin,.motion-bounce,.motion-happy{animation:happy 2.2s ease-in-out!important}.celebration span{animation:none!important}.route-node{transition:none}}
