{"id":27072,"date":"2026-08-24T21:44:20","date_gmt":"2026-08-24T16:14:20","guid":{"rendered":"https:\/\/qsh.in\/boards\/wbbse\/?p=27072"},"modified":"2026-08-24T22:20:37","modified_gmt":"2026-08-24T16:50:37","slug":"single-digit-subtraction","status":"publish","type":"post","link":"https:\/\/qsh.in\/boards\/wbbse\/mental-math\/single-digit-subtraction\/","title":{"rendered":"\u09e7-\u0985\u0999\u09cd\u0995\u09c7\u09b0 \u09ac\u09bf\u09df\u09cb\u0997 \u0985\u09a8\u09c1\u09b6\u09c0\u09b2\u09a8: Magic Tree Game!"},"content":{"rendered":"<p>\u09ae\u09c7\u09a8\u09cd\u099f\u09be\u09b2 \u09ae\u09cd\u09af\u09be\u09a5 \u0995\u09cb\u09b0\u09cd\u09b8\u09c7\u09b0 \u09b7\u09b7\u09cd\u09a0 \u09a6\u09bf\u09a8\u09c7 \u09a4\u09cb\u09ae\u09be\u09a6\u09c7\u09b0 \u09b8\u09cd\u09ac\u09be\u0997\u09a4 \u099c\u09be\u09a8\u09be\u0987! \u09af\u09cb\u0997 \u09b6\u09c7\u0996\u09be\u09b0 \u09aa\u09b0 \u09ac\u09bf\u09af\u09bc\u09cb\u0997\u09c7 \u09b9\u09be\u09a4 \u09a6\u09bf\u09b2\u09c7 \u0985\u09a8\u09c7\u0995\u09c7\u0987 \u0986\u09ac\u09be\u09b0 \u0986\u0999\u09c1\u09b2 \u0997\u09cb\u09a8\u09be\u09b0 \u09aa\u09c1\u09b0\u09a8\u09cb \u0985\u09ad\u09cd\u09af\u09be\u09b8\u09c7 \u09ab\u09bf\u09b0\u09c7 \u09af\u09be\u09af\u09bc\u0964 \u0986\u099c\u0995\u09c7\u09b0 \u09aa\u09be\u09a0\u09c7\u09b0 \u09ae\u09c2\u09b2 \u09b2\u0995\u09cd\u09b7\u09cd\u09af \u09b9\u09b2\u09cb \u0986\u0999\u09c1\u09b2 \u0997\u09cb\u09a8\u09be \u09b8\u09ae\u09cd\u09aa\u09c2\u09b0\u09cd\u09a3 \u09ac\u09a8\u09cd\u09a7 \u0995\u09b0\u09c7 \u09ae\u09b8\u09cd\u09a4\u09bf\u09b8\u09cd\u0995\u0995\u09c7 \u09a6\u09cd\u09b0\u09c1\u09a4 \u0989\u09a4\u09cd\u09a4\u09b0 \u09a6\u09bf\u09a4\u09c7 \u09ac\u09be\u09a7\u09cd\u09af \u0995\u09b0\u09be\u0964<\/p>\n<p>\u09ac\u09bf\u09af\u09bc\u09cb\u0997\u0995\u09c7 \u09b6\u09c1\u09a7\u09c1\u09ae\u09be\u09a4\u09cd\u09b0 \u2018\u09ac\u09be\u09a6 \u09a6\u09c7\u0993\u09af\u09bc\u09be\u2019 \u09b9\u09bf\u09b8\u09c7\u09ac\u09c7 \u09a8\u09be \u09a6\u09c7\u0996\u09c7, \u0986\u09ae\u09b0\u09be \u0986\u099c \u098f\u0995\u09c7 \u09a6\u09c1\u099f\u09bf \u09b8\u0982\u0996\u09cd\u09af\u09be\u09b0 \u2018\u09a6\u09c2\u09b0\u09a4\u09cd\u09ac\u2019 \u09ac\u09be \u09af\u09cb\u0997\u09c7\u09b0 \u0989\u09b2\u09cd\u099f\u09cb \u09aa\u09cd\u09b0\u0995\u09cd\u09b0\u09bf\u09af\u09bc\u09be \u09b9\u09bf\u09b8\u09c7\u09ac\u09c7 \u09ad\u09be\u09ac\u09a4\u09c7 \u09b6\u09bf\u0996\u09ac\u0964 \u099a\u09b2\u09cb \u09a6\u09c7\u0996\u09c7 \u09a8\u09bf\u0987 \u09a6\u09cd\u09b0\u09c1\u09a4 \u09ac\u09bf\u09df\u09cb\u0997 \u0995\u09b0\u09be\u09b0 \u09e9\u099f\u09bf \u09a6\u09be\u09b0\u09c1\u09a3 \u0995\u09cc\u09b6\u09b2\u0964<\/p>\n<h2>\u09ac\u09bf\u09af\u09bc\u09cb\u0997\u0995\u09c7 \u09b8\u09b9\u099c \u0995\u09b0\u09be\u09b0 \u09e9\u099f\u09bf \u09ae\u09c7\u09a8\u09cd\u099f\u09be\u09b2 \u09ae\u09cd\u09af\u09be\u09a5 \u099f\u09cd\u09b0\u09bf\u0995\u09b8<\/h2>\n<h3>\u09e7. \u09af\u09cb\u0997\u09c7\u09b0 \u09ae\u09be\u09a7\u09cd\u09af\u09ae\u09c7 \u09ac\u09bf\u09af\u09bc\u09cb\u0997 (Think Addition)<\/h3>\n<p>\u09b8\u09ac\u099a\u09c7\u09af\u09bc\u09c7 \u0995\u09be\u09b0\u09cd\u09af\u0995\u09b0 \u0995\u09cc\u09b6\u09b2 \u09b9\u09b2\u09cb \u09ac\u09bf\u09af\u09bc\u09cb\u0997 \u0985\u0999\u09cd\u0995\u0995\u09c7 \u09af\u09cb\u0997 \u0985\u0999\u09cd\u0995\u09c7 \u09aa\u09b0\u09bf\u09a3\u09a4 \u0995\u09b0\u09c7 \u09ab\u09c7\u09b2\u09be\u0964 \u0995\u09be\u09b0\u09a3 \u0986\u09ae\u09be\u09a6\u09c7\u09b0 \u09ae\u09b8\u09cd\u09a4\u09bf\u09b7\u09cd\u0995 \u09ac\u09bf\u09af\u09bc\u09cb\u0997\u09c7\u09b0 \u099a\u09c7\u09af\u09bc\u09c7 \u09af\u09cb\u0997 \u0985\u09a8\u09c7\u0995 \u09a6\u09cd\u09b0\u09c1\u09a4 \u09aa\u09cd\u09b0\u09b8\u09c7\u09b8 \u0995\u09b0\u09a4\u09c7 \u09aa\u09be\u09b0\u09c7\u0964<\/p>\n<p><strong>\u0989\u09a6\u09be\u09b9\u09b0\u09a3: \u09e7\u09e9 \u2013 \u09ee = \u0995\u09a4?<\/strong><\/p>\n<ul>\n<li>\u09e7\u09e9 \u09a5\u09c7\u0995\u09c7 \u09ee \u09ac\u09be\u09a6 \u09a6\u09c7\u0993\u09af\u09bc\u09be\u09b0 \u0995\u09a5\u09be \u09a8\u09be \u09ad\u09c7\u09ac\u09c7, \u0989\u09b2\u09cd\u099f\u09cb\u09ad\u09be\u09ac\u09c7 \u09ad\u09be\u09ac\u09cb: <strong>\u201c\u09ee-\u098f\u09b0 \u09b8\u09be\u09a5\u09c7 \u0995\u09a4 \u09af\u09cb\u0997 \u0995\u09b0\u09b2\u09c7 \u09e7\u09e9 \u09b9\u09af\u09bc?\u201d<\/strong><\/li>\n<li>\u09af\u09c7\u09b9\u09c7\u09a4\u09c1 \u09a4\u09cb\u09ae\u09b0\u09be \u0986\u0997\u09c7\u09b0 \u0995\u09cd\u09b2\u09be\u09b8\u0997\u09c1\u09b2\u09cb \u09a5\u09c7\u0995\u09c7 \u09af\u09cb\u0997\u09c7 \u09aa\u09be\u09b0\u09a6\u09b0\u09cd\u09b6\u09c0 \u09b9\u09df\u09c7 \u0997\u09c7\u099b, \u09a4\u09be\u0987 \u09ac\u09cd\u09b0\u09c7\u09a8 \u09a6\u09cd\u09b0\u09c1\u09a4 \u09ae\u09a8\u09c7 \u0995\u09b0\u09a4\u09c7 \u09aa\u09be\u09b0\u09ac\u09c7 \u09ee + \u09eb = \u09e7\u09e9\u0964<\/li>\n<li>\u0985\u09a4\u098f\u09ac, \u09e7\u09e9 \u2013 \u09ee = \u09eb\u0964<\/li>\n<\/ul>\n<h3>\u09e8. \u09aa\u09c7\u099b\u09a8\u09c7\u09b0 \u09a6\u09bf\u0995\u09c7 \u0997\u09cb\u09a8\u09be (Counting Backwards)<\/h3>\n<p>\u09af\u0996\u09a8 \u09ac\u09bf\u09af\u09bc\u09cb\u0997 \u0995\u09b0\u09be \u09b8\u0982\u0996\u09cd\u09af\u09be\u099f\u09bf \u0996\u09c1\u09ac \u099b\u09cb\u099f (\u09af\u09c7\u09ae\u09a8: \u09e7, \u09e8 \u09ac\u09be \u09e9) \u09b9\u09af\u09bc, \u09a4\u0996\u09a8 \u09af\u09cb\u0997\u09c7\u09b0 \u0995\u09a5\u09be \u09ad\u09be\u09ac\u09be\u09b0\u0993 \u09a6\u09b0\u0995\u09be\u09b0 \u09a8\u09c7\u0987\u0964 \u09b6\u09c1\u09a7\u09c1 \u09b8\u0982\u0996\u09cd\u09af\u09be\u099f\u09bf\u09b0 \u0986\u0997\u09c7\u09b0 \u09b8\u0982\u0996\u09cd\u09af\u09be\u0997\u09c1\u09b2\u09cb \u09ae\u09a8\u09c7 \u09ae\u09a8\u09c7 \u09a6\u09cd\u09b0\u09c1\u09a4 \u09ac\u09b2\u09c7 \u09ab\u09c7\u09b2\u09b2\u09c7\u0987 \u09b9\u09af\u09bc\u0964<\/p>\n<p><strong>\u0989\u09a6\u09be\u09b9\u09b0\u09a3: \u09ee \u2013 \u09e8 = ?<\/strong><\/p>\n<ul>\n<li>\u09ee \u098f\u09b0 \u0986\u0997\u09c7\u09b0 \u09a6\u09c1\u099f\u09bf \u09b8\u0982\u0996\u09cd\u09af\u09be \u09ae\u09a8\u09c7 \u09ae\u09a8\u09c7 \u09aa\u09dc\u09cb: \u201c\u09ed\u2026 \u09ec\u201d\u0964<\/li>\n<li>\u0989\u09a4\u09cd\u09a4\u09b0 \u09b9\u09ac\u09c7: \u09ec\u0964<\/li>\n<\/ul>\n<h3>\u09e9. \u09e7\u09e6-\u098f\u09b0 \u09ac\u09c7\u09b8 \u09ac\u09cd\u09af\u09ac\u09b9\u09be\u09b0 \u0995\u09b0\u09be (Bridging through 10)<\/h3>\n<p>\u09af\u0996\u09a8 \u09e7\u09e6-\u098f\u09b0 \u0989\u09aa\u09b0\u09c7\u09b0 \u0995\u09cb\u09a8\u09cb \u09b8\u0982\u0996\u09cd\u09af\u09be \u09a5\u09c7\u0995\u09c7 \u09ac\u09bf\u09af\u09bc\u09cb\u0997 \u0995\u09b0\u09a4\u09c7 \u09b9\u09af\u09bc, \u09a4\u0996\u09a8 \u09e7\u09e6-\u0995\u09c7 \u098f\u0995\u099f\u09bf \u09ac\u09cd\u09b0\u09bf\u099c \u09ac\u09be \u09b8\u09c7\u09a4\u09c1 \u09b9\u09bf\u09b8\u09c7\u09ac\u09c7 \u09ac\u09cd\u09af\u09ac\u09b9\u09be\u09b0 \u0995\u09b0\u09b2\u09c7 \u09b9\u09bf\u09b8\u09be\u09ac \u0996\u09c1\u09ac \u09b8\u09b9\u099c \u09b9\u09df\u09c7 \u09af\u09be\u09df\u0964<\/p>\n<p><strong>\u0989\u09a6\u09be\u09b9\u09b0\u09a3: \u09e7\u09ea \u2013 \u09ec = ?<\/strong><\/p>\n<ul>\n<li><strong>\u09a7\u09be\u09aa \u09e7:<\/strong> \u09e7\u09ea \u09a5\u09c7\u0995\u09c7 \u09aa\u09cd\u09b0\u09a5\u09ae\u09c7 \u09ea \u09ac\u09be\u09a6 \u09a6\u09bf\u09af\u09bc\u09c7 \u09a6\u09be\u0993, \u09a4\u09be\u09b9\u09b2\u09c7 \u09e7\u09e6 \u09b9\u09af\u09bc\u09c7 \u0997\u09c7\u09b2\u09cb (\u09e7\u09ea \u2013 \u09ea = \u09e7\u09e6)\u0964<\/li>\n<li><strong>\u09a7\u09be\u09aa \u09e8:<\/strong> \u0986\u09ae\u09be\u09a6\u09c7\u09b0 \u09ae\u09cb\u099f \u09ec \u09ac\u09be\u09a6 \u09a6\u09c7\u0993\u09af\u09bc\u09be\u09b0 \u0995\u09a5\u09be \u099b\u09bf\u09b2\u0964 \u0986\u09ae\u09b0\u09be \u09ea \u09ac\u09be\u09a6 \u09a6\u09bf\u09af\u09bc\u09c7\u099b\u09bf, \u09ae\u09be\u09a8\u09c7 \u0986\u09b0\u0993 \u09e8 \u09ac\u09be\u09a6 \u09a6\u09bf\u09a4\u09c7 \u09b9\u09ac\u09c7\u0964<\/li>\n<li><strong>\u09a7\u09be\u09aa \u09e9:<\/strong> \u098f\u09ac\u09be\u09b0 \u09e7\u09e6 \u09a5\u09c7\u0995\u09c7 \u09e8 \u09ac\u09be\u09a6 \u09a6\u09be\u0993\u0964 (\u09e7\u09e6-\u098f\u09b0 \u099c\u09cb\u09dc\u09be\u09b0 \u09b8\u09c2\u09a4\u09cd\u09b0 \u0985\u09a8\u09c1\u09af\u09be\u09df\u09c0 \u09e7\u09e6 \u2013 \u09e8 = \u09ee)\u0964<\/li>\n<li>\u0985\u09a4\u098f\u09ac, \u09e7\u09ea \u2013 \u09ec = \u09ee\u0964<\/li>\n<\/ul>\n<h2>\u09aa\u09cd\u09b0\u09cd\u09af\u09be\u0995\u099f\u09bf\u09b8 \u0997\u09c7\u09ae: Magic Tree (\u099c\u09be\u09a6\u09c1\u09b0 \u0997\u09be\u099b)<\/h2>\n<p>\u09ac\u09bf\u09af\u09bc\u09cb\u0997\u09c7\u09b0 \u09b8\u09cd\u09aa\u09bf\u09a1 \u09ac\u09be\u09dc\u09be\u09a4\u09c7 \u0986\u099c \u0986\u09ae\u09b0\u09be \u0996\u09c7\u09b2\u09ac <strong>\u09ae\u09cd\u09af\u09be\u099c\u09bf\u0995 \u099f\u09cd\u09b0\u09bf (Magic Tree)<\/strong> \u0997\u09c7\u09ae! \u09a4\u09cb\u09ae\u09be\u09b0 \u0995\u09be\u099c \u09b9\u09b2\u09cb \u09b8\u09a0\u09bf\u0995 \u09ac\u09bf\u09df\u09cb\u0997\u09ab\u09b2 \u09ac\u09c7\u09b0 \u0995\u09b0\u09c7 \u098f\u0995\u099f\u09bf \u099b\u09cb\u099f \u099a\u09be\u09b0\u09be\u0997\u09be\u099b\u09c7 \u099c\u09b2 \u09a6\u09c7\u0993\u09df\u09be \u098f\u09ac\u0982 \u09a4\u09be\u0995\u09c7 \u098f\u0995\u099f\u09bf \u09ac\u09dc, \u09ab\u09b2\u09ac\u09a4\u09c0 \u0997\u09be\u099b\u09c7 \u09aa\u09b0\u09bf\u09a3\u09a4 \u0995\u09b0\u09be\u0964<\/p>\n<h3>\u0995\u09c0\u09ad\u09be\u09ac\u09c7 \u0996\u09c7\u09b2\u09ac\u09c7?<\/h3>\n<ul>\n<li>\u09b8\u09cd\u0995\u09cd\u09b0\u09bf\u09a8\u09c7\u09b0 \u09ac\u09be\u0981-\u09a6\u09bf\u0995\u09c7 \u098f\u0995\u099f\u09bf \u0995\u09be\u09a0\u09c7\u09b0 \u09b8\u09be\u0987\u09a8\u09ac\u09cb\u09b0\u09cd\u09a1\u09c7 \u09e7-\u0985\u0999\u09cd\u0995\u09c7\u09b0 \u09ac\u09bf\u09af\u09bc\u09cb\u0997 \u09a6\u09c7\u0993\u09df\u09be \u09a5\u09be\u0995\u09ac\u09c7 (\u09af\u09c7\u09ae\u09a8: \u09e7\u09ea \u2013 \u09ee = ?)\u0964<\/li>\n<li>\u09b8\u09cd\u0995\u09cd\u09b0\u09bf\u09a8\u09c7\u09b0 \u09a8\u09bf\u099a\u09c7 \u09a5\u09be\u0995\u09be \u09a4\u09bf\u09a8\u099f\u09bf \u2018\u099c\u09b2\u09c7\u09b0 \u09ab\u09cb\u0981\u099f\u09be\u2019 (Water Drops) \u09a5\u09c7\u0995\u09c7 \u09b8\u09a0\u09bf\u0995 \u0989\u09a4\u09cd\u09a4\u09b0\u099f\u09bf \u099f\u09cd\u09af\u09be\u09aa \u0995\u09b0\u09cb\u0964<\/li>\n<li>\u09b8\u09a0\u09bf\u0995 \u0989\u09a4\u09cd\u09a4\u09b0 \u09a6\u09bf\u09b2\u09c7 \u09a4\u09cb\u09ae\u09be\u09b0 \u099c\u09be\u09a6\u09c1\u09b0 \u0997\u09be\u099b\u09c7 \u099c\u09b2 \u09aa\u09dc\u09ac\u09c7 \u098f\u09ac\u0982 \u0997\u09be\u099b\u099f\u09bf \u09a7\u09c0\u09b0\u09c7 \u09a7\u09c0\u09b0\u09c7 \u09ac\u09dc \u09b9\u09ac\u09c7 (\u099a\u09be\u09b0\u09be\u0997\u09be\u099b \u09a5\u09c7\u0995\u09c7 \u09aa\u09be\u09a4\u09be \u098f\u09ac\u0982 \u09b6\u09c7\u09b7\u09c7 \u09ab\u09b2 \u09a7\u09b0\u09ac\u09c7)\u0964<\/li>\n<li>\u09ad\u09c1\u09b2 \u0989\u09a4\u09cd\u09a4\u09b0 \u09a6\u09bf\u09b2\u09c7 \u0997\u09be\u099b\u09c7\u09b0 \u099c\u09b2\u09c7\u09b0 \u09b8\u09cd\u09a4\u09b0 \u0995\u09ae\u09c7 \u09af\u09be\u09ac\u09c7 \u098f\u09ac\u0982 \u0997\u09be\u099b\u099f\u09bf \u09b6\u09c1\u0995\u09bf\u09df\u09c7 \u09aa\u09be\u09a4\u09be \u099d\u09b0\u09a4\u09c7 \u09b6\u09c1\u09b0\u09c1 \u0995\u09b0\u09ac\u09c7\u0964<\/li>\n<li>\u09a4\u09cb\u09ae\u09be\u09b0 \u09b2\u0995\u09cd\u09b7\u09cd\u09af \u09b9\u09b2\u09cb \u099c\u09b2\u09c7\u09b0 \u09b8\u09cd\u09a4\u09b0 (Water Level) \u09e7\u09e6\u09e6% \u09aa\u09c2\u09b0\u09cd\u09a3 \u0995\u09b0\u09c7 \u0997\u09be\u099b\u099f\u09bf\u0995\u09c7 \u09b8\u09ae\u09cd\u09aa\u09c2\u09b0\u09cd\u09a3 \u09ac\u09dc \u0995\u09b0\u09c7 \u09a4\u09cb\u09b2\u09be!<\/li>\n<\/ul>\n<p>\u0996\u09be\u09a4\u09be-\u0995\u09b2\u09ae \u09a6\u09c2\u09b0\u09c7 \u09b8\u09b0\u09bf\u09df\u09c7 \u09b0\u09be\u0996\u09cb \u0986\u09b0 \u09af\u09cb\u0997\u09c7\u09b0 \u09b8\u09be\u09b9\u09be\u09af\u09cd\u09af\u09c7 \u09ac\u09bf\u09df\u09cb\u0997 \u0995\u09b0\u09c7 \u09a4\u09cb\u09ae\u09be\u09b0 \u099c\u09be\u09a6\u09c1\u09b0 \u0997\u09be\u099b\u099f\u09bf\u0995\u09c7 \u09ac\u09be\u0981\u099a\u09bf\u09df\u09c7 \u09a4\u09cb\u09b2\u09cb!<\/p>\n    <div id=\"qsh-27072-377\" class=\"qsh-sim-frame-wrap\" style=\"--qsh-aspect: 4\/3;\">\n        <div class=\"qsh-sim-bar\">\n            <div class=\"qsh-sim-label\"><span class=\"qsh-dot\"><\/span> Interactive Simulator<\/div>\n            <div class=\"qsh-sim-controls\">\n                <button type=\"button\" class=\"qsh-sim-btn qsh-btn-reload\" onclick=\"document.getElementById('if-qsh-27072-377').srcdoc = document.getElementById('if-qsh-27072-377').srcdoc;\" aria-label=\"Restart\">\n                    <svg viewbox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"currentColor\"><path d=\"M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\"><\/path><\/svg>\n                <\/button>\n                <button type=\"button\" class=\"qsh-sim-btn qsh-btn-fs\" id=\"fs-btn-qsh-27072-377\" aria-label=\"Fullscreen\">\n                    <svg viewbox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"currentColor\"><path d=\"M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z\"><\/path><\/svg>\n                    <span>Expand<\/span>\n                <\/button>\n            <\/div>\n        <\/div>\n        <div class=\"qsh-sim-viewport\">\n            <iframe id=\"if-qsh-27072-377\" srcdoc=\"&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;base href=&quot;https:\/\/qsh.in\/boards\/wbbse\/&quot;&gt;&lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no&quot;&gt;&lt;style&gt;*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}html,body{width:100%;height:100%;margin:0;padding:0;overflow:hidden;touch-action:manipulation;background:#0b0f19;color:#f8fafc;font-family:system-ui,-apple-system,sans-serif;}&lt;\/style&gt;&lt;style&gt;:root {\r\n    --bg-sky: #d0f0fd; \r\n    --grass-light: #52d273;\r\n    --grass-dark: #22c55e;\r\n    --primary: #0ea5e9; \r\n    --accent: #facc15;  \r\n    --danger: #ef4444;  \r\n    --wood-light: #b45309;\r\n    --wood-dark: #78350f;\r\n    --text-main: #f8fafc;\r\n    --font-ui: &quot;Comic Sans MS&quot;, &quot;Comic Sans&quot;, system-ui, sans-serif;\r\n}\r\n\r\n#sim-root * { box-sizing: border-box; margin: 0; padding: 0; }\r\n\r\n#sim-root {\r\n    position: relative; width: 100%; max-width: 800px;\r\n    height: 85vh; height: 85dvh; min-height: 600px; max-height: 900px;\r\n    margin: 1rem auto; background-color: var(--bg-sky);\r\n    overflow: hidden; touch-action: manipulation;\r\n    -webkit-tap-highlight-color: transparent; user-select: none;\r\n    font-family: var(--font-ui); border-radius: 16px;\r\n    box-shadow: 0 15px 40px rgba(0,0,0,0.5); \r\n    display: flex; flex-direction: column;\r\n}\r\n\r\n\/* Beautiful Background *\/\r\n#garden-bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(180deg, #7dd3fc 0%, #e0f2fe 60%); z-index: 0; overflow: hidden; }\r\n.sun { position: absolute; top: 12%; right: 8%; width: 100px; height: 100px; background: #fde047; border-radius: 50%; box-shadow: 0 0 60px #facc15, 0 0 120px #fef08a; animation: pulse-sun 4s infinite alternate ease-in-out; }\r\n@keyframes pulse-sun { 0% { transform: scale(1); opacity: 0.8; } 100% { transform: scale(1.1); opacity: 1; } }\r\n.grass-ground { position: absolute; bottom: 0; left: 0; width: 100%; height: 35%; background: linear-gradient(180deg, var(--grass-light) 0%, var(--grass-dark) 100%); border-radius: 50% 50% 0 0 \/ 40px 40px 0 0; box-shadow: inset 0 10px 30px rgba(0,0,0,0.15); }\r\n\r\n\/* Scene Viewport *\/\r\n#scene-viewport { flex: 1 1 auto; position: relative; width: 100%; z-index: 1; perspective: 800px; overflow: hidden;}\r\n#game-canvas { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 10; pointer-events: none; }\r\n\r\n\/* Dynamic Tree Logic *\/\r\n#tree-container {\r\n    position: absolute; bottom: 15%; left: 50%;\r\n    width: clamp(160px, 40vw, 260px); transform: translateX(-50%); z-index: 5;\r\n    transform-origin: bottom center;\r\n}\r\n\r\n\/* This element scales continuously based on water level *\/\r\n#tree-scaler {\r\n    transform: scale(var(--growth-scale, 0.4));\r\n    transform-origin: bottom center;\r\n    transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n}\r\n\r\n.tree-bounce { animation: t-bounce 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275); }\r\n@keyframes t-bounce { 0% { transform: translateX(-50%) translateY(0) scale(1); } 50% { transform: translateX(-50%) translateY(-10px) scale(1.05); } 100% { transform: translateX(-50%) translateY(0) scale(1); } }\r\n\r\n.tree-shrink { animation: t-shrink 0.6s ease-in-out; filter: saturate(0.5) hue-rotate(-10deg); }\r\n@keyframes t-shrink { 0% { transform: translateX(-50%) scale(1); } 50% { transform: translateX(-50%) scale(0.95) translateY(5px); } 100% { transform: translateX(-50%) scale(1); } }\r\n\r\n\/* Tree Sway *\/\r\n#base-canopy { animation: sway 4s infinite alternate ease-in-out; transform-origin: center 150px; }\r\n@keyframes sway { 0% { transform: rotate(-2deg); } 100% { transform: rotate(2deg); } }\r\n\r\n\/* Double Group Leaf Animations (Fixes position bugs) *\/\r\n.anim-pop-leaf { animation: pop-leaf 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }\r\n@keyframes pop-leaf { 0% { transform: scale(0); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }\r\n\r\n.anim-fall-leaf { animation: fall-leaf 1.5s ease-in forwards; }\r\n@keyframes fall-leaf { \r\n    0% { transform: translateY(0) rotate(0deg); opacity: 1; } \r\n    20% { transform: translateY(-10px) translateX(10px) rotate(20deg); opacity: 1; }\r\n    100% { transform: translateY(200px) translateX(30px) rotate(90deg); opacity: 0; } \r\n}\r\n\r\n\/* Animated Watering Can *\/\r\n#watering-can {\r\n    position: absolute; bottom: 38%; left: 55%;\r\n    width: clamp(70px, 18vw, 110px); z-index: 15;\r\n    transform-origin: bottom right; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n}\r\n.can-hidden { opacity: 0; transform: translateX(80px) translateY(-20px) rotate(10deg) scale(0.5); }\r\n.can-pour { opacity: 1; transform: translateX(0) translateY(0) rotate(-40deg) scale(1); animation: can-hover 0.5s infinite alternate; }\r\n@keyframes can-hover { 0% { transform: rotate(-40deg) translateY(0); } 100% { transform: rotate(-40deg) translateY(-5px); } }\r\n\r\n\/* Wooden Signpost (Math Problem + Timer) *\/\r\n#math-signpost {\r\n    position: absolute; top: 12%; left: 4%;\r\n    display: flex; flex-direction: column; align-items: center; z-index: 6;\r\n    filter: drop-shadow(0 15px 15px rgba(0,0,0,0.25));\r\n    transform-origin: top center; animation: swing-sign 4s infinite alternate ease-in-out;\r\n}\r\n@keyframes swing-sign { 0% { transform: rotate(-3deg); } 100% { transform: rotate(3deg); } }\r\n\r\n.wooden-board {\r\n    background: var(--wood-light); border: 4px solid var(--wood-dark); border-radius: 8px;\r\n    padding: 1rem 1.8rem; position: relative; box-shadow: inset 0 0 15px rgba(0,0,0,0.6);\r\n    background-image: repeating-linear-gradient(0deg, transparent, transparent 15px, rgba(0,0,0,0.08) 15px, rgba(0,0,0,0.08) 30px);\r\n}\r\n.wooden-post { width: 16px; height: 120px; background: var(--wood-dark); border-radius: 0 0 5px 5px; margin-top: -5px; z-index: -1; box-shadow: inset -4px 0 6px rgba(0,0,0,0.4); }\r\n.nails { display: flex; justify-content: space-between; width: 100%; position: absolute; left: 0; padding: 0 12px; }\r\n.nails:first-child { top: 6px; } .nails:last-child { bottom: 6px; }\r\n.nail { width: 8px; height: 8px; background: #94a3b8; border-radius: 50%; box-shadow: inset 1px 1px 3px #0f172a, 0 1px 1px rgba(255,255,255,0.4); }\r\n\r\n#math-equation { \r\n    display: flex; align-items: center; justify-content: center; gap: 10px;\r\n    font-size: clamp(2.8rem, 8vw, 4rem); font-weight: 900; color: #fef3c7; \r\n    font-family: ui-monospace, monospace; text-shadow: 3px 3px 5px rgba(0,0,0,0.7);\r\n}\r\n.operator { color: #fca5a5; font-size: clamp(2.2rem, 6vw, 3.5rem); }\r\n.question-mark { color: #38bdf8; text-shadow: 0 0 20px rgba(56,189,248,0.9); animation: pulse-text 1s infinite alternate; }\r\n@keyframes pulse-text { 0% { transform: scale(0.95); opacity: 0.8;} 100% { transform: scale(1.1); opacity: 1;} }\r\n\r\n\/* Dynamic Timer Bar inside signpost *\/\r\n.timer-bar-wrapper {\r\n    width: 100%; height: 10px; background: rgba(0,0,0,0.6); \r\n    border-radius: 5px; margin-top: 12px; overflow: hidden;\r\n    box-shadow: inset 0 2px 5px rgba(0,0,0,0.6); border: 1px solid rgba(255,255,255,0.2);\r\n}\r\n.timer-bar-fill { height: 100%; width: 100%; background: #4ade80; transition: width 0.1s linear, background-color 0.3s; }\r\n\r\n\/* Hit Flash Layer *\/\r\n#hit-flash { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fef08a; opacity: 0; z-index: 2; pointer-events: none; transition: opacity 0.1s; }\r\n.flash-active { opacity: 0.4 !important; }\r\n\r\n\/* HUD Top *\/\r\n#hud-top {\r\n    position: absolute; top: 0; left: 0; width: 100%;\r\n    padding: clamp(0.8rem, 2vh, 1.2rem); display: flex; justify-content: space-between; align-items: flex-start;\r\n    z-index: 20; background: linear-gradient(180deg, rgba(255,255,255,0.95) 0%, transparent 100%); pointer-events: none;\r\n}\r\n.hud-box { display: flex; flex-direction: column; align-items: center; }\r\n.center-box { flex-grow: 1; margin: 0 1rem; }\r\n.hud-label { font-size: 0.8rem; color: #1e293b; font-weight: 900; margin-bottom: 5px; letter-spacing: 0.5px; text-shadow: 0 1px 2px #fff;}\r\n.hud-value { font-size: 1.8rem; font-weight: 900; font-variant-numeric: tabular-nums; color: #2563eb; text-shadow: 0 2px 4px rgba(255,255,255,0.8); }\r\n\r\n#health-container { display: flex; gap: 6px; font-size: 1.6rem; }\r\n.heart { opacity: 0.3; filter: grayscale(1); transition: all 0.3s; }\r\n.heart.active { opacity: 1; filter: grayscale(0); filter: drop-shadow(0 0 5px red); }\r\n\r\n.water-bar-wrapper { display: flex; align-items: center; justify-content: center; margin-top: 2px; width: 100%; }\r\n.water-bar-bg { width: 100%; max-width: 180px; height: 22px; background: rgba(255,255,255,0.9); border: 3px solid #0284c7; border-radius: 12px; overflow: hidden; box-shadow: inset 0 3px 6px rgba(0,0,0,0.2); }\r\n.water-bar-fill { height: 100%; width: 0%; background: linear-gradient(90deg, #38bdf8, #0284c7); box-shadow: inset 0 3px 6px rgba(255,255,255,0.5); transition: width 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275), background-color 0.3s ease; }\r\n\r\n\/* Control Dock *\/\r\n#control-dock {\r\n    flex: 0 0 auto; width: 100%; \r\n    padding: 1.2rem 1rem calc(1.5rem + env(safe-area-inset-bottom, 15px));\r\n    background: linear-gradient(0deg, rgba(208,240,253,1) 40%, rgba(208,240,253,0.85) 100%);\r\n    border-top: 3px solid #7dd3fc; z-index: 30; display: flex; flex-direction: column; align-items: center;\r\n}\r\n.dock-title { font-size: 1.1rem; color: #0369a1; font-weight: 900; margin-bottom: 1.2rem; text-shadow: 0 1px 2px #fff;}\r\n.options-grid { display: flex; justify-content: center; gap: 1.5rem; width: 100%; max-width: 500px; }\r\n\r\n\/* Water Drop Buttons *\/\r\n.water-drop-btn {\r\n    flex: 1; max-width: 110px; aspect-ratio: 1\/1.1;\r\n    background: linear-gradient(135deg, #7dd3fc 0%, #0284c7 100%);\r\n    border: 3px solid #0284c7; border-radius: 50% 50% 50% 5px; transform: rotate(-45deg);\r\n    box-shadow: 6px 6px 15px rgba(0,0,0,0.2), inset 2px 2px 10px rgba(255,255,255,0.6);\r\n    cursor: pointer; transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n    display: flex; justify-content: center; align-items: center;\r\n}\r\n.drop-text { transform: rotate(45deg); color: #fff; font-size: 2.6rem; font-weight: 900; text-shadow: 0 3px 5px rgba(0,0,0,0.5); pointer-events: none;}\r\n.water-drop-btn:active { transform: rotate(-45deg) scale(0.9); box-shadow: 2px 2px 5px rgba(0,0,0,0.3); background: linear-gradient(135deg, #38bdf8 0%, #0369a1 100%); }\r\n.btn-correct { border-color: #10b981 !important; background: linear-gradient(135deg, #4ade80 0%, #16a34a 100%) !important; box-shadow: 0 0 30px #4ade80 !important;}\r\n.btn-wrong { border-color: #ef4444 !important; background: linear-gradient(135deg, #f87171 0%, #b91c1c 100%) !important; box-shadow: 0 0 30px #ef4444 !important;}\r\n\r\n\/* Feedback Layer *\/\r\n#feedback-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 40; }\r\n.floating-text { position: absolute; left: 50%; transform: translateX(-50%); text-align: center; width: 100%; font-weight: 900; font-family: var(--font-ui); animation: floatUp 1.2s cubic-bezier(0.2, 1, 0.3, 1) forwards; }\r\n@keyframes floatUp { 0% { opacity: 0; transform: translate(-50%, 20px) scale(0.8); } 20% { opacity: 1; transform: translate(-50%, 0) scale(1.2); } 100% { opacity: 0; transform: translate(-50%, -100px) scale(1); } }\r\n\r\n\/* Overlays &amp; Super Visible Start Button *\/\r\n.glass-panel { background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); border: 2px solid #bae6fd; box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2); }\r\n.overlay-screen { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 500px; border-radius: 24px; display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 100; text-align: center; padding: 3.5rem 2.5rem;}\r\n.overlay-screen.hidden { display: none; }\r\n.overlay-title { color: #16a34a; font-size: 3.5rem; margin-bottom: 1.5rem; text-shadow: 0 3px 6px rgba(0,0,0,0.1); font-weight: 900;}\r\n.overlay-desc { color: #334155; font-size: 1.3rem; line-height: 1.6; margin-bottom: 3rem; font-weight: 700;}\r\n\r\n\/* Bold, Pulsing Start Button *\/\r\n.action-btn {\r\n    background: linear-gradient(to bottom, #f59e0b, #d97706); color: #fff; border: 4px solid #fef3c7; border-radius: 50px;\r\n    padding: 1.5rem 4rem; font-size: 1.8rem; font-weight: 900; cursor: pointer; letter-spacing: 1px;\r\n    box-shadow: 0 8px 0 #92400e, 0 15px 30px rgba(217, 119, 6, 0.5); transition: all 0.1s; \r\n}\r\n.action-btn:active { transform: translateY(8px); box-shadow: 0 0 0 #92400e; }\r\n.start-pulse { animation: pulse-btn 1.5s infinite; }\r\n@keyframes pulse-btn { 0% { transform: scale(1); } 50% { transform: scale(1.08); box-shadow: 0 8px 0 #92400e, 0 25px 40px rgba(217, 119, 6, 0.7); } 100% { transform: scale(1); } }&lt;\/style&gt;&lt;\/head&gt;&lt;body&gt;&lt;div id=&quot;sim-root&quot;&gt;\r\n    <!-- Beautiful Sunny Garden Background -->\r\n    &lt;div id=&quot;garden-bg&quot;&gt;\r\n        &lt;div class=&quot;sun&quot;&gt;&lt;\/div&gt;\r\n        &lt;div class=&quot;clouds&quot;&gt;&lt;\/div&gt;\r\n        &lt;div class=&quot;grass-ground&quot;&gt;&lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n\r\n    <!-- 3D Game Viewport -->\r\n    &lt;div id=&quot;scene-viewport&quot;&gt;\r\n        \r\n        <!-- Main Tree SVG (Highly Detailed & Realistic Vector Art) -->\r\n        &lt;div id=&quot;tree-container&quot;&gt;\r\n            &lt;div id=&quot;tree-scaler&quot;&gt;\r\n                &lt;svg id=&quot;magic-tree&quot; viewBox=&quot;0 0 200 250&quot; xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot;&gt;\r\n                    &lt;defs&gt;\r\n                        <!-- Realistic Gradients -->\r\n                        &lt;linearGradient id=&quot;trunkGrad&quot; x1=&quot;0%&quot; y1=&quot;0%&quot; x2=&quot;100%&quot; y2=&quot;0%&quot;&gt;\r\n                            &lt;stop offset=&quot;0%&quot; stop-color=&quot;#451a03&quot;\/&gt;\r\n                            &lt;stop offset=&quot;30%&quot; stop-color=&quot;#78350f&quot;\/&gt;\r\n                            &lt;stop offset=&quot;70%&quot; stop-color=&quot;#92400e&quot;\/&gt;\r\n                            &lt;stop offset=&quot;100%&quot; stop-color=&quot;#451a03&quot;\/&gt;\r\n                        &lt;\/linearGradient&gt;\r\n                        &lt;radialGradient id=&quot;canopyLight&quot; cx=&quot;30%&quot; cy=&quot;30%&quot; r=&quot;70%&quot;&gt;\r\n                            &lt;stop offset=&quot;0%&quot; stop-color=&quot;#4ade80&quot;\/&gt;\r\n                            &lt;stop offset=&quot;70%&quot; stop-color=&quot;#16a34a&quot;\/&gt;\r\n                            &lt;stop offset=&quot;100%&quot; stop-color=&quot;#14532d&quot;\/&gt;\r\n                        &lt;\/radialGradient&gt;\r\n                        &lt;radialGradient id=&quot;canopyDark&quot; cx=&quot;30%&quot; cy=&quot;30%&quot; r=&quot;70%&quot;&gt;\r\n                            &lt;stop offset=&quot;0%&quot; stop-color=&quot;#22c55e&quot;\/&gt;\r\n                            &lt;stop offset=&quot;70%&quot; stop-color=&quot;#15803d&quot;\/&gt;\r\n                            &lt;stop offset=&quot;100%&quot; stop-color=&quot;#064e3b&quot;\/&gt;\r\n                        &lt;\/radialGradient&gt;\r\n                        &lt;filter id=&quot;shadow&quot; x=&quot;-20%&quot; y=&quot;-20%&quot; width=&quot;140%&quot; height=&quot;140%&quot;&gt;\r\n                            &lt;feDropShadow dx=&quot;2&quot; dy=&quot;4&quot; stdDeviation=&quot;3&quot; flood-opacity=&quot;0.3&quot;\/&gt;\r\n                        &lt;\/filter&gt;\r\n                    &lt;\/defs&gt;\r\n\r\n                    <!-- Ground Shadow -->\r\n                    &lt;ellipse cx=&quot;100&quot; cy=&quot;240&quot; rx=&quot;55&quot; ry=&quot;12&quot; fill=&quot;rgba(0,0,0,0.2)&quot; \/&gt;\r\n                    \r\n                    <!-- Tree Trunk & Main Branches -->\r\n                    &lt;path d=&quot;M 85 240 Q 95 150 95 90 L 105 90 Q 105 150 115 240 Z&quot; fill=&quot;url(#trunkGrad)&quot; \/&gt;\r\n                    &lt;path d=&quot;M 95 160 Q 60 140 40 100&quot; fill=&quot;none&quot; stroke=&quot;url(#trunkGrad)&quot; stroke-width=&quot;12&quot; stroke-linecap=&quot;round&quot; \/&gt;\r\n                    &lt;path d=&quot;M 105 140 Q 140 120 160 80&quot; fill=&quot;none&quot; stroke=&quot;url(#trunkGrad)&quot; stroke-width=&quot;10&quot; stroke-linecap=&quot;round&quot; \/&gt;\r\n                    &lt;path d=&quot;M 100 120 L 100 50&quot; fill=&quot;none&quot; stroke=&quot;url(#trunkGrad)&quot; stroke-width=&quot;10&quot; stroke-linecap=&quot;round&quot; \/&gt;\r\n                    \r\n                    <!-- Base Canopy (Scales independently to simulate growth) -->\r\n                    &lt;g id=&quot;base-canopy&quot; filter=&quot;url(#shadow)&quot;&gt;\r\n                        <!-- Back layer -->\r\n                        &lt;circle cx=&quot;50&quot; cy=&quot;100&quot; r=&quot;35&quot; fill=&quot;url(#canopyDark)&quot; \/&gt;\r\n                        &lt;circle cx=&quot;150&quot; cy=&quot;80&quot; r=&quot;35&quot; fill=&quot;url(#canopyDark)&quot; \/&gt;\r\n                        &lt;circle cx=&quot;100&quot; cy=&quot;50&quot; r=&quot;45&quot; fill=&quot;url(#canopyDark)&quot; \/&gt;\r\n                        <!-- Front layer -->\r\n                        &lt;circle cx=&quot;75&quot; cy=&quot;120&quot; r=&quot;30&quot; fill=&quot;url(#canopyLight)&quot; \/&gt;\r\n                        &lt;circle cx=&quot;125&quot; cy=&quot;110&quot; r=&quot;28&quot; fill=&quot;url(#canopyLight)&quot; \/&gt;\r\n                        &lt;circle cx=&quot;100&quot; cy=&quot;80&quot; r=&quot;40&quot; fill=&quot;url(#canopyLight)&quot; \/&gt;\r\n                    &lt;\/g&gt;\r\n\r\n                    <!-- Dynamic Leaves Group (Populated via JS per answer) -->\r\n                    &lt;g id=&quot;dynamic-leaves&quot;&gt;&lt;\/g&gt;\r\n                    <!-- Fruits Group (Populated when tree is large) -->\r\n                    &lt;g id=&quot;dynamic-fruits&quot;&gt;&lt;\/g&gt;\r\n                &lt;\/svg&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n\r\n        <!-- 3D Canvas Environment (For Water Particles & Debris) -->\r\n        &lt;canvas id=&quot;game-canvas&quot;&gt;&lt;\/canvas&gt;\r\n\r\n        <!-- Animated Watering Can -->\r\n        &lt;div id=&quot;watering-can&quot; class=&quot;can-hidden&quot;&gt;\r\n            &lt;svg viewBox=&quot;0 0 100 100&quot; xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot;&gt;\r\n                <!-- Water drops falling out -->\r\n                &lt;g id=&quot;can-water-drops&quot; opacity=&quot;0&quot;&gt;\r\n                    &lt;circle cx=&quot;5&quot; cy=&quot;40&quot; r=&quot;3&quot; fill=&quot;#bae6fd&quot; \/&gt;\r\n                    &lt;circle cx=&quot;15&quot; cy=&quot;45&quot; r=&quot;4&quot; fill=&quot;#7dd3fc&quot; \/&gt;\r\n                    &lt;circle cx=&quot;8&quot; cy=&quot;55&quot; r=&quot;3&quot; fill=&quot;#38bdf8&quot; \/&gt;\r\n                &lt;\/g&gt;\r\n                &lt;path d=&quot;M 35 30 L 75 30 L 85 80 L 25 80 Z&quot; fill=&quot;#38bdf8&quot; stroke=&quot;#0284c7&quot; stroke-width=&quot;2&quot;\/&gt;\r\n                &lt;path d=&quot;M 35 30 Q 55 20 75 30&quot; fill=&quot;#7dd3fc&quot; \/&gt;\r\n                &lt;path d=&quot;M 25 80 Q 55 90 85 80&quot; fill=&quot;#0284c7&quot; \/&gt;\r\n                &lt;path d=&quot;M 30 50 L 5 30 L 12 25 L 35 45 Z&quot; fill=&quot;#bae6fd&quot; stroke=&quot;#0284c7&quot; stroke-width=&quot;2&quot;\/&gt;\r\n                &lt;path d=&quot;M 80 40 Q 100 40 100 60 Q 100 80 83 70&quot; fill=&quot;none&quot; stroke=&quot;#0284c7&quot; stroke-width=&quot;6&quot; stroke-linecap=&quot;round&quot;\/&gt;\r\n                &lt;ellipse cx=&quot;8&quot; cy=&quot;27&quot; rx=&quot;4&quot; ry=&quot;12&quot; fill=&quot;#fcd34d&quot; transform=&quot;rotate(-45 8 27)&quot; \/&gt;\r\n            &lt;\/svg&gt;\r\n        &lt;\/div&gt;\r\n\r\n        <!-- Math Signpost (Left Side) -->\r\n        &lt;div id=&quot;math-signpost&quot;&gt;\r\n            &lt;div class=&quot;wooden-board&quot;&gt;\r\n                &lt;div class=&quot;nails&quot;&gt;\r\n                    &lt;div class=&quot;nail&quot;&gt;&lt;\/div&gt;&lt;div class=&quot;nail&quot;&gt;&lt;\/div&gt;\r\n                &lt;\/div&gt;\r\n                &lt;div id=&quot;math-equation&quot;&gt;\r\n                    &lt;span id=&quot;num-a&quot;&gt;\u09e6&lt;\/span&gt; \r\n                    &lt;span class=&quot;operator&quot;&gt;-&lt;\/span&gt; \r\n                    &lt;span id=&quot;num-b&quot;&gt;\u09e6&lt;\/span&gt; \r\n                    &lt;span class=&quot;operator&quot;&gt;=&lt;\/span&gt; \r\n                    &lt;span class=&quot;question-mark&quot;&gt;?&lt;\/span&gt;\r\n                &lt;\/div&gt;\r\n                <!-- Dynamic Timer Bar inside the signpost -->\r\n                &lt;div class=&quot;timer-bar-wrapper&quot;&gt;\r\n                    &lt;div class=&quot;timer-bar-fill&quot; id=&quot;timer-bar&quot;&gt;&lt;\/div&gt;\r\n                &lt;\/div&gt;\r\n                &lt;div class=&quot;nails&quot;&gt;\r\n                    &lt;div class=&quot;nail&quot;&gt;&lt;\/div&gt;&lt;div class=&quot;nail&quot;&gt;&lt;\/div&gt;\r\n                &lt;\/div&gt;\r\n            &lt;\/div&gt;\r\n            &lt;div class=&quot;wooden-post&quot;&gt;&lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n\r\n    <!-- HUD (Heads Up Display) -->\r\n    &lt;div id=&quot;hud-top&quot;&gt;\r\n        &lt;div class=&quot;hud-box&quot;&gt;\r\n            &lt;span class=&quot;hud-label&quot;&gt;\u09b8\u09cd\u0995\u09cb\u09b0&lt;\/span&gt;\r\n            &lt;span class=&quot;hud-value text-accent&quot; id=&quot;score-display&quot;&gt;\u09e6&lt;\/span&gt;\r\n        &lt;\/div&gt;\r\n        \r\n        &lt;div class=&quot;hud-box center-box&quot;&gt;\r\n            &lt;span class=&quot;hud-label&quot;&gt;\u099c\u09b2\u09c7\u09b0 \u09b8\u09cd\u09a4\u09b0 (WATER LEVEL)&lt;\/span&gt;\r\n            &lt;div class=&quot;water-bar-wrapper&quot;&gt;\r\n                &lt;div class=&quot;water-bar-bg&quot;&gt;\r\n                    &lt;div class=&quot;water-bar-fill&quot; id=&quot;water-bar&quot;&gt;&lt;\/div&gt;\r\n                &lt;\/div&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n\r\n        &lt;div class=&quot;hud-box&quot;&gt;\r\n            &lt;span class=&quot;hud-label&quot;&gt;\u099c\u09c0\u09ac\u09a8 (LIVES)&lt;\/span&gt;\r\n            &lt;div id=&quot;health-container&quot;&gt;\r\n                &lt;span class=&quot;heart active&quot;&gt;\u2764\ufe0f&lt;\/span&gt;\r\n                &lt;span class=&quot;heart active&quot;&gt;\u2764\ufe0f&lt;\/span&gt;\r\n                &lt;span class=&quot;heart active&quot;&gt;\u2764\ufe0f&lt;\/span&gt;\r\n            &lt;\/div&gt;\r\n        &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n\r\n    <!-- Floating Text Feedback Layer -->\r\n    &lt;div id=&quot;feedback-layer&quot;&gt;&lt;\/div&gt;\r\n\r\n    <!-- Thumb Zone (Interactive Control Dock) -->\r\n    &lt;div id=&quot;control-dock&quot;&gt;\r\n        &lt;div class=&quot;dock-title&quot;&gt;\u09b8\u09a0\u09bf\u0995 \u0989\u09a4\u09cd\u09a4\u09b0 \u09a8\u09bf\u09b0\u09cd\u09ac\u09be\u099a\u09a8 \u0995\u09b0\u09c7 \u0997\u09be\u099b\u09c7 \u099c\u09b2 \u09a6\u09be\u0993:&lt;\/div&gt;\r\n        &lt;div class=&quot;options-grid&quot;&gt;\r\n            &lt;button class=&quot;water-drop-btn&quot; id=&quot;core-0&quot;&gt;\r\n                &lt;span class=&quot;drop-text&quot;&gt;\u09e6&lt;\/span&gt;\r\n            &lt;\/button&gt;\r\n            &lt;button class=&quot;water-drop-btn&quot; id=&quot;core-1&quot;&gt;\r\n                &lt;span class=&quot;drop-text&quot;&gt;\u09e6&lt;\/span&gt;\r\n            &lt;\/button&gt;\r\n            &lt;button class=&quot;water-drop-btn&quot; id=&quot;core-2&quot;&gt;\r\n                &lt;span class=&quot;drop-text&quot;&gt;\u09e6&lt;\/span&gt;\r\n            &lt;\/button&gt;\r\n        &lt;\/div&gt;\r\n    &lt;\/div&gt;\r\n\r\n    <!-- Overlays -->\r\n    &lt;div id=&quot;game-overlay&quot; class=&quot;overlay-screen glass-panel&quot;&gt;\r\n        &lt;h1 class=&quot;overlay-title&quot;&gt;MAGIC TREE&lt;\/h1&gt;\r\n        &lt;p class=&quot;overlay-desc&quot;&gt;\u09e7-\u0985\u0999\u09cd\u0995\u09c7\u09b0 \u09ac\u09bf\u09df\u09cb\u0997\u0964&lt;br&gt;\u09ac\u09bf\u09af\u09bc\u09cb\u0997\u0995\u09c7 \u09af\u09cb\u0997\u09c7\u09b0 \u09ae\u09a4\u09cb \u09ad\u09be\u09ac\u09cb! \u09a6\u09cd\u09b0\u09c1\u09a4 \u09b8\u09a0\u09bf\u0995 \u0989\u09a4\u09cd\u09a4\u09b0 \u09a6\u09bf\u09df\u09c7 \u099c\u09be\u09a6\u09c1\u09b0 \u0997\u09be\u099b\u099f\u09bf\u0995\u09c7 \u09ab\u09c1\u09b2\u09c7-\u09ab\u09b2\u09c7 \u09ad\u09b0\u09bf\u09df\u09c7 \u09a4\u09cb\u09b2\u09cb!&lt;\/p&gt;\r\n        &lt;button id=&quot;btn-start&quot; class=&quot;action-btn start-pulse&quot;&gt;\u0997\u09c7\u09ae \u09b6\u09c1\u09b0\u09c1 \u0995\u09b0\u09cb&lt;\/button&gt;\r\n    &lt;\/div&gt;\r\n&lt;\/div&gt;&lt;script&gt;\n        window.GameController = {\n            saveScore: function(score, time, extraData) {\n                window.parent.postMessage({\n                    action: 'qsh_save_score',\n                    sim_id: 27072,\n                    score: score,\n                    time: time || 0,\n                    meta: extraData || {}\n                }, 'https:\/\/qsh.in\/boards\/wbbse');\n            }\n        };\n    &lt;\/script&gt;&lt;script&gt;(() =&gt; {\r\n    const initSimulator = () =&gt; {\r\n        const mountPoint = document.getElementById('game-mount-point');\r\n        const container = document.getElementById('sim-root');\r\n        if (mountPoint &amp;&amp; container &amp;&amp; mountPoint !== container.parentNode) {\r\n            mountPoint.appendChild(container);\r\n        }\r\n\r\n        const EN_TO_BN = {'0':'\u09e6', '1':'\u09e7', '2':'\u09e8', '3':'\u09e9', '4':'\u09ea', '5':'\u09eb', '6':'\u09ec', '7':'\u09ed', '8':'\u09ee', '9':'\u09ef'};\r\n        function toBn(numStr) { return String(numStr).split('').map(c =&gt; EN_TO_BN[c] || c).join(''); }\r\n\r\n        const Config = {\r\n            maxWater: 150, \r\n            waterPerHit: 10, \/\/ Requires 15 correct answers to fully grow\r\n            waterPenalty: 10,\r\n            maxLives: 3,\r\n            initialTimeLimit: 7.0, \/\/ Max 7 seconds initially\r\n            minTimeLimit: 5.0      \/\/ Min 5 seconds\r\n        };\r\n\r\n        const State = {\r\n            isPlaying: false, lastTime: 0, score: 0, waterLevel: 0, lives: Config.maxLives,\r\n            totalAttempts: 0, correctAttempts: 0, startTime: 0,\r\n            currentA: 0, currentB: 0, correctAnswer: 0,\r\n            particles: [], pouring: false, pourTimer: 0,\r\n            timeRemaining: 0, timeLimit: Config.initialTimeLimit,\r\n            leafNodes: [] \/\/ Track dynamic SVG leaves\r\n        };\r\n\r\n        const DOM = {\r\n            root: document.getElementById('sim-root'),\r\n            canvas: document.getElementById('game-canvas'),\r\n            ctx: document.getElementById('game-canvas') ? document.getElementById('game-canvas').getContext('2d') : null,\r\n            scoreDisp: document.getElementById('score-display'),\r\n            hearts: document.querySelectorAll('.heart'),\r\n            waterBar: document.getElementById('water-bar'),\r\n            timerBar: document.getElementById('timer-bar'),\r\n            cores: [document.getElementById('core-0'), document.getElementById('core-1'), document.getElementById('core-2')],\r\n            feedbackLayer: document.getElementById('feedback-layer'),\r\n            treeContainer: document.getElementById('tree-container'),\r\n            treeScaler: document.getElementById('tree-scaler'),\r\n            dynamicLeavesGroup: document.getElementById('dynamic-leaves'),\r\n            dynamicFruitsGroup: document.getElementById('dynamic-fruits'),\r\n            wateringCan: document.getElementById('watering-can'),\r\n            hitFlash: document.getElementById('hit-flash'),\r\n            numA: document.getElementById('num-a'),\r\n            numB: document.getElementById('num-b'),\r\n            mathSignpost: document.getElementById('math-signpost'),\r\n            overlay: document.getElementById('game-overlay'),\r\n            btnStart: document.getElementById('btn-start')\r\n        };\r\n\r\n        const AudioEngine = {\r\n            ctx: null, tts: window.speechSynthesis, enabled: false,\r\n            init() {\r\n                if (!this.ctx) {\r\n                    const AudioContext = window.AudioContext || window.webkitAudioContext;\r\n                    if(AudioContext) this.ctx = new AudioContext();\r\n                }\r\n                if (this.ctx &amp;&amp; this.ctx.state === 'suspended') this.ctx.resume();\r\n                if ('speechSynthesis' in window) {\r\n                    this.enabled = true;\r\n                    const u = new SpeechSynthesisUtterance(''); u.volume = 0; this.tts.speak(u);\r\n                }\r\n            },\r\n            speak(text, pitch=1.1) {\r\n                if (!this.enabled) return;\r\n                this.tts.cancel();\r\n                const u = new SpeechSynthesisUtterance(text);\r\n                u.lang = 'bn-IN'; u.rate = 1.1; u.pitch = pitch; \r\n                this.tts.speak(u);\r\n            },\r\n            playSplash() {\r\n                if (!this.ctx) return;\r\n                const bufferSize = this.ctx.sampleRate * 0.4; \r\n                const buffer = this.ctx.createBuffer(1, bufferSize, this.ctx.sampleRate);\r\n                const data = buffer.getChannelData(0);\r\n                for (let i = 0; i &lt; bufferSize; i++) { data[i] = Math.random() * 2 - 1; }\r\n                const noise = this.ctx.createBufferSource(); noise.buffer = buffer;\r\n                const filter = this.ctx.createBiquadFilter(); filter.type = 'bandpass'; filter.frequency.value = 800;\r\n                const gain = this.ctx.createGain(); gain.gain.setValueAtTime(0.6, this.ctx.currentTime); gain.gain.exponentialRampToValueAtTime(0.01, this.ctx.currentTime + 0.4);\r\n                noise.connect(filter); filter.connect(gain); gain.connect(this.ctx.destination); noise.start();\r\n            },\r\n            playPop() {\r\n                if (!this.ctx) return;\r\n                const osc = this.ctx.createOscillator(); const gain = this.ctx.createGain();\r\n                osc.type = 'sine'; osc.frequency.setValueAtTime(500, this.ctx.currentTime); osc.frequency.exponentialRampToValueAtTime(1000, this.ctx.currentTime + 0.2);\r\n                gain.gain.setValueAtTime(0.5, this.ctx.currentTime); gain.gain.exponentialRampToValueAtTime(0.01, this.ctx.currentTime + 0.2);\r\n                osc.connect(gain); gain.connect(this.ctx.destination); osc.start(); osc.stop(this.ctx.currentTime + 0.2);\r\n            },\r\n            playDry() {\r\n                if (!this.ctx) return;\r\n                const osc = this.ctx.createOscillator(); const gain = this.ctx.createGain();\r\n                osc.type = 'sawtooth'; osc.frequency.setValueAtTime(150, this.ctx.currentTime); osc.frequency.linearRampToValueAtTime(80, this.ctx.currentTime + 0.3);\r\n                gain.gain.setValueAtTime(0.4, this.ctx.currentTime); gain.gain.linearRampToValueAtTime(0.01, this.ctx.currentTime + 0.3);\r\n                osc.connect(gain); gain.connect(this.ctx.destination); osc.start(); osc.stop(this.ctx.currentTime + 0.3);\r\n            }\r\n        };\r\n\r\n        let width, height;\r\n        function resizeCanvas() {\r\n            if(!DOM.canvas || !DOM.ctx) return;\r\n            const rect = DOM.canvas.parentElement.getBoundingClientRect();\r\n            const dpr = window.devicePixelRatio || 1;\r\n            DOM.canvas.width = rect.width * dpr; DOM.canvas.height = rect.height * dpr;\r\n            width = rect.width; height = rect.height;\r\n            DOM.ctx.setTransform(1, 0, 0, 1, 0, 0); DOM.ctx.scale(dpr, dpr);\r\n        }\r\n        window.addEventListener('resize', resizeCanvas);\r\n\r\n        function updateLives() {\r\n            DOM.hearts.forEach((heart, i) =&gt; {\r\n                if(i &lt; State.lives) heart.classList.add('active');\r\n                else heart.classList.remove('active');\r\n            });\r\n            if (State.lives &lt;= 0) endGame(&quot;\u0997\u09be\u099b\u099f\u09bf \u09b6\u09c1\u0995\u09bf\u09df\u09c7 \u0997\u09c7\u099b\u09c7!&quot;);\r\n        }\r\n\r\n        \/\/ --- Visual Leaf SVG Logic (Double Nested for CSS isolated animation) ---\r\n        function addVisibleLeaf() {\r\n            if(!DOM.dynamicLeavesGroup) return;\r\n            \r\n            \/\/ Outer wrapper handles positioning\r\n            const wrapper = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'g');\r\n            \/\/ Scatter leaves across the canopy (cx=100, cy=80)\r\n            const randomX = 100 + (Math.random() * 100 - 50);\r\n            const randomY = 80 + (Math.random() * 80 - 40);\r\n            const rotation = Math.random() * 360;\r\n            const scale = Math.random() * 0.6 + 0.8;\r\n            \r\n            wrapper.setAttribute('transform', `translate(${randomX}, ${randomY}) rotate(${rotation}) scale(${scale})`);\r\n\r\n            \/\/ Inner group handles the animation to prevent coordinate override\r\n            const inner = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'g');\r\n            inner.setAttribute('class', 'anim-pop-leaf');\r\n\r\n            \/\/ Draw a nice leaf shape\r\n            const path = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'path');\r\n            path.setAttribute('d', 'M 0 15 C 15 -15 35 -5 45 15 C 35 30 15 30 0 15 Z');\r\n            \r\n            const colors = ['#4ade80', '#22c55e', '#16a34a', '#84cc16'];\r\n            path.setAttribute('fill', colors[Math.floor(Math.random()*colors.length)]);\r\n            path.setAttribute('filter', 'url(#shadow)');\r\n\r\n            inner.appendChild(path);\r\n            wrapper.appendChild(inner);\r\n            DOM.dynamicLeavesGroup.appendChild(wrapper);\r\n            \r\n            State.leafNodes.push({ wrapper: wrapper, inner: inner, path: path });\r\n            AudioEngine.playPop();\r\n\r\n            \/\/ Add Fruits if tree is getting big (score &gt; 10)\r\n            if (State.correctAttempts &gt; 10 &amp;&amp; DOM.dynamicFruitsGroup &amp;&amp; Math.random() &gt; 0.5) {\r\n                const fruit = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'circle');\r\n                fruit.setAttribute('cx', randomX + 10);\r\n                fruit.setAttribute('cy', randomY + 10);\r\n                fruit.setAttribute('r', 8);\r\n                fruit.setAttribute('fill', Math.random() &gt; 0.5 ? '#ef4444' : '#f43f5e');\r\n                fruit.setAttribute('filter', 'url(#shadow)');\r\n                fruit.setAttribute('class', 'anim-pop-fruit');\r\n                DOM.dynamicFruitsGroup.appendChild(fruit);\r\n            }\r\n        }\r\n\r\n        function removeVisibleLeaf() {\r\n            if(State.leafNodes.length &gt; 0) {\r\n                const node = State.leafNodes.pop();\r\n                node.path.setAttribute('fill', '#b45309'); \/\/ Turn brown\r\n                \r\n                node.inner.classList.remove('anim-pop-leaf');\r\n                void node.inner.offsetWidth; \/\/ Force reflow\r\n                node.inner.classList.add('anim-fall-leaf'); \/\/ Fall relative to its current wrapper pos\r\n                \r\n                setTimeout(() =&gt; { \r\n                    if(node.wrapper.parentNode) node.wrapper.parentNode.removeChild(node.wrapper); \r\n                }, 1500);\r\n            }\r\n        }\r\n\r\n        function generateProblem() {\r\n            let a, b, ans;\r\n            let loopGuard = 0;\r\n            \/\/ Robust generation to prevent hangs\r\n            do {\r\n                a = Math.floor(Math.random() * 10) + 9; \/\/ 9 to 18\r\n                b = Math.floor(Math.random() * 8) + 2;  \/\/ 2 to 9\r\n                ans = a - b;\r\n                loopGuard++;\r\n            } while ((a &lt;= b || ans &gt;= 10 || (a === State.currentA &amp;&amp; b === State.currentB)) &amp;&amp; loopGuard &lt; 20);\r\n\r\n            State.currentA = a; State.currentB = b; State.correctAnswer = ans;\r\n\r\n            if (DOM.numA) DOM.numA.textContent = toBn(State.currentA);\r\n            if (DOM.numB) DOM.numB.textContent = toBn(State.currentB);\r\n\r\n            \/\/ Timer Scaling: 7s down to 5s based on correct answers\r\n            State.timeLimit = Math.max(Config.minTimeLimit, Config.initialTimeLimit - (State.correctAttempts * 0.15));\r\n            State.timeRemaining = State.timeLimit;\r\n\r\n            if (DOM.mathSignpost) {\r\n                DOM.mathSignpost.style.transform = 'rotate(-5deg) scale(1.05)';\r\n                setTimeout(() =&gt; { DOM.mathSignpost.style.transform = 'rotate(0deg) scale(1)'; }, 200);\r\n            }\r\n\r\n            \/\/ Generate options robustly\r\n            let options = [State.correctAnswer];\r\n            let attempts = 0;\r\n            while(options.length &lt; 3 &amp;&amp; attempts &lt; 50) {\r\n                let offset = Math.floor(Math.random() * 9) - 4; \/\/ -4 to +4\r\n                let wrong = State.correctAnswer + offset;\r\n                if (wrong &gt; 0 &amp;&amp; wrong !== State.correctAnswer &amp;&amp; !options.includes(wrong)) {\r\n                    options.push(wrong);\r\n                }\r\n                attempts++;\r\n            }\r\n            \r\n            \/\/ Fallback just in case\r\n            if (options.length &lt; 3) {\r\n                let fallback = 1;\r\n                while (options.length &lt; 3) {\r\n                    if (!options.includes(fallback) &amp;&amp; fallback !== State.correctAnswer) options.push(fallback);\r\n                    fallback++;\r\n                }\r\n            }\r\n            \r\n            options.sort(() =&gt; Math.random() - 0.5);\r\n            DOM.cores.forEach((btn, i) =&gt; {\r\n                if (btn &amp;&amp; options[i] !== undefined) {\r\n                    const span = btn.querySelector('.drop-text');\r\n                    if(span) span.textContent = toBn(options[i]); \r\n                    btn.dataset.val = options[i];\r\n                    btn.classList.remove('btn-correct', 'btn-wrong');\r\n                }\r\n            });\r\n        }\r\n\r\n        function showFloatingText(text, isGood) {\r\n            if (!DOM.feedbackLayer) return;\r\n            const el = document.createElement('div');\r\n            el.className = `floating-text`;\r\n            el.style.fontSize = isGood ? '3rem' : '2.5rem';\r\n            el.style.bottom = '45%';\r\n            el.style.color = isGood ? '#10b981' : '#ef4444';\r\n            el.style.textShadow = isGood ? '0 0 20px #4ade80' : '0 0 20px #f87171';\r\n            el.textContent = text;\r\n            DOM.feedbackLayer.appendChild(el);\r\n            setTimeout(() =&gt; el.remove(), 1200);\r\n        }\r\n\r\n        function spawnWaterParticles() {\r\n            const originX = width * 0.55; const originY = height * 0.65; \/\/ Matches watering can spout\r\n            for(let i=0; i&lt;30; i++) {\r\n                State.particles.push({\r\n                    x: originX + (Math.random() - 0.5) * 20, y: originY + (Math.random() - 0.5) * 20,\r\n                    vx: -150 + (Math.random() * 100), vy: 100 + (Math.random() * 200),\r\n                    life: 1.0, size: Math.random() * 6 + 3,\r\n                    color: '#38bdf8', type: 'water'\r\n                });\r\n            }\r\n        }\r\n\r\n        function updateTreeScale() {\r\n            State.waterLevel = Math.max(0, Math.min(Config.maxWater, State.waterLevel));\r\n            \r\n            if (DOM.waterBar) {\r\n                const percent = (State.waterLevel \/ Config.maxWater) * 100;\r\n                DOM.waterBar.style.width = `${percent}%`;\r\n            }\r\n\r\n            \/\/ Continuous Scaling Logic\r\n            if(DOM.treeScaler) {\r\n                \/\/ Starts at 0.4 scale, grows up to 1.1\r\n                const scale = 0.4 + (State.waterLevel \/ Config.maxWater) * 0.7;\r\n                DOM.treeScaler.style.setProperty('--growth-scale', scale);\r\n                DOM.treeScaler.style.transform = `scale(${scale})`;\r\n            }\r\n            \r\n            if (State.waterLevel &gt;= Config.maxWater) {\r\n                setTimeout(() =&gt; endGame(&quot;\u0997\u09be\u099b\u099f\u09bf \u09ac\u09dc \u09b9\u09df\u09c7\u099b\u09c7!&quot;), 1500);\r\n            }\r\n        }\r\n\r\n        function triggerError(message) {\r\n            State.lives--; updateLives();\r\n            State.waterLevel -= Config.waterPenalty;\r\n            \r\n            removeVisibleLeaf(); \r\n            \r\n            if(DOM.treeContainer) {\r\n                DOM.treeContainer.classList.remove('tree-shrink');\r\n                void DOM.treeContainer.offsetWidth;\r\n                DOM.treeContainer.classList.add('tree-shrink');\r\n            }\r\n            \r\n            if(DOM.hitFlash) {\r\n                DOM.hitFlash.classList.add('flash-active');\r\n                setTimeout(() =&gt; DOM.hitFlash.classList.remove('flash-active'), 200);\r\n            }\r\n            \r\n            AudioEngine.playDry();\r\n            AudioEngine.speak(message === &quot;\u09b8\u09ae\u09df \u09b6\u09c7\u09b7!&quot; ? &quot;\u09b8\u09ae\u09df \u09b6\u09c7\u09b7!&quot; : &quot;\u0989\u09ab! \u09ad\u09c1\u09b2 \u09b9\u09df\u09c7\u099b\u09c7\u0964&quot;, 0.9);\r\n            showFloatingText(message, false);\r\n            \r\n            updateTreeScale();\r\n            State.pouring = true; \r\n            State.pourTimer = 0.5; \r\n            \r\n            setTimeout(() =&gt; {\r\n                State.pouring = false;\r\n                if(State.waterLevel &lt; Config.maxWater &amp;&amp; State.lives &gt; 0) generateProblem();\r\n            }, 800);\r\n        }\r\n\r\n        function handleAnswer(btnElement) {\r\n            if (!State.isPlaying || State.pouring) return;\r\n            \r\n            State.totalAttempts++;\r\n            const selected = parseInt(btnElement.dataset.val);\r\n            State.pouring = true;\r\n            \r\n            if (selected === State.correctAnswer) {\r\n                State.correctAttempts++;\r\n                State.waterLevel += Config.waterPerHit;\r\n                State.score += 20;\r\n                if (DOM.scoreDisp) DOM.scoreDisp.textContent = toBn(State.score);\r\n                \r\n                btnElement.classList.add('btn-correct');\r\n                \r\n                if (DOM.wateringCan) {\r\n                    DOM.wateringCan.classList.remove('can-hidden');\r\n                    DOM.wateringCan.classList.add('can-pour');\r\n                    const drops = document.getElementById('can-water-drops');\r\n                    if(drops) drops.setAttribute('opacity', '1');\r\n                }\r\n                \r\n                AudioEngine.playSplash();\r\n                State.pourTimer = 0.6;\r\n                \r\n                if (DOM.treeContainer) {\r\n                    DOM.treeContainer.classList.remove('tree-bounce');\r\n                    void DOM.treeContainer.offsetWidth;\r\n                    DOM.treeContainer.classList.add('tree-bounce');\r\n                }\r\n\r\n                \/\/ Add visual leaves\r\n                setTimeout(addVisibleLeaf, 100);\r\n                setTimeout(addVisibleLeaf, 300);\r\n\r\n                let praises = [{ text: &quot;\u09b8\u09a0\u09bf\u0995!&quot;, voice: &quot;Good job!&quot; }, { text: &quot;\u09a6\u09be\u09b0\u09c1\u09a3!&quot;, voice: &quot;Excellent!&quot; }];\r\n                let praise = praises[Math.floor(Math.random() * praises.length)];\r\n                showFloatingText(praise.text, true);\r\n                if(Math.random() &lt; 0.5) AudioEngine.speak(praise.voice);\r\n                \r\n                updateTreeScale();\r\n                \r\n                setTimeout(() =&gt; {\r\n                    btnElement.classList.remove('btn-correct');\r\n                    if (DOM.wateringCan) { \r\n                        DOM.wateringCan.classList.remove('can-pour'); \r\n                        DOM.wateringCan.classList.add('can-hidden'); \r\n                        const drops = document.getElementById('can-water-drops');\r\n                        if(drops) drops.setAttribute('opacity', '0');\r\n                    }\r\n                    State.pouring = false;\r\n                    if(State.waterLevel &lt; Config.maxWater &amp;&amp; State.lives &gt; 0) generateProblem();\r\n                }, 800);\r\n\r\n            } else {\r\n                btnElement.classList.add('btn-wrong');\r\n                triggerError(&quot;\u09aa\u09be\u09a4\u09be \u099d\u09b0\u09c7 \u0997\u09c7\u09b2!&quot;);\r\n                setTimeout(() =&gt; { btnElement.classList.remove('btn-wrong'); }, 800);\r\n            }\r\n        }\r\n\r\n        function update(dt) {\r\n            if(!DOM.ctx) return;\r\n            const dtSec = dt \/ 1000;\r\n\r\n            if (State.pouring &amp;&amp; State.pourTimer &gt; 0) {\r\n                State.pourTimer -= dtSec;\r\n                if (DOM.wateringCan &amp;&amp; DOM.wateringCan.classList.contains('can-pour')) spawnWaterParticles();\r\n            } else if (State.isPlaying &amp;&amp; !State.pouring) {\r\n                \/\/ Dynamic Timer Countdown\r\n                State.timeRemaining -= dtSec;\r\n                if(DOM.timerBar) {\r\n                    const pct = Math.max(0, (State.timeRemaining \/ State.timeLimit) * 100);\r\n                    DOM.timerBar.style.width = `${pct}%`;\r\n                    if(pct &gt; 50) DOM.timerBar.style.backgroundColor = '#4ade80';\r\n                    else if(pct &gt; 25) DOM.timerBar.style.backgroundColor = '#facc15';\r\n                    else DOM.timerBar.style.backgroundColor = '#ef4444';\r\n                }\r\n\r\n                if (State.timeRemaining &lt;= 0) {\r\n                    triggerError(&quot;\u09b8\u09ae\u09df \u09b6\u09c7\u09b7!&quot;);\r\n                }\r\n            }\r\n\r\n            for (let i = State.particles.length - 1; i &gt;= 0; i--) {\r\n                let p = State.particles[i];\r\n                p.x += p.vx * dtSec; p.y += p.vy * dtSec; \r\n                p.vy += 600 * dtSec; \/\/ Gravity\r\n                p.life -= dtSec * 1.5;\r\n                if (p.life &lt;= 0) State.particles.splice(i, 1);\r\n            }\r\n        }\r\n\r\n        function draw() {\r\n            if(!DOM.ctx) return;\r\n            DOM.ctx.clearRect(0, 0, width, height);\r\n\r\n            State.particles.forEach(p =&gt; {\r\n                DOM.ctx.globalAlpha = Math.max(0, p.life);\r\n                DOM.ctx.fillStyle = p.color;\r\n                if(p.type === 'water') {\r\n                    DOM.ctx.beginPath(); DOM.ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2); DOM.ctx.fill();\r\n                }\r\n            });\r\n            DOM.ctx.globalAlpha = 1.0;\r\n        }\r\n\r\n        function loop(timestamp) {\r\n            if (!State.isPlaying) return;\r\n            const dt = timestamp - State.lastTime; State.lastTime = timestamp;\r\n            if (dt &lt; 100) { update(dt); draw(); }\r\n            requestAnimationFrame(loop);\r\n        }\r\n\r\n        function startGame() {\r\n            AudioEngine.init(); resizeCanvas();\r\n            State.isPlaying = true; State.score = 0; State.lives = Config.maxLives;\r\n            State.waterLevel = 0; State.totalAttempts = 0; State.correctAttempts = 0; State.startTime = Date.now();\r\n            State.particles = []; State.pouring = false;\r\n            \r\n            \/\/ Reset dynamic SVGs\r\n            if(DOM.dynamicLeavesGroup) DOM.dynamicLeavesGroup.innerHTML = '';\r\n            if(DOM.dynamicFruitsGroup) DOM.dynamicFruitsGroup.innerHTML = '';\r\n            State.leafNodes = [];\r\n            \r\n            if (DOM.scoreDisp) DOM.scoreDisp.textContent = &quot;\u09e6&quot;; \r\n            \r\n            updateLives();\r\n            updateTreeScale();\r\n            \r\n            if (DOM.overlay) DOM.overlay.classList.add('hidden');\r\n            if (DOM.btnStart) DOM.btnStart.classList.remove('start-pulse');\r\n            \r\n            State.lastTime = performance.now();\r\n            generateProblem();\r\n            requestAnimationFrame(loop);\r\n        }\r\n\r\n        function endGame(titleText) {\r\n            State.isPlaying = false;\r\n            \r\n            const accuracy = State.totalAttempts &gt; 0 ? Math.round((State.correctAttempts \/ State.totalAttempts) * 100) : 0;\r\n            const timeSpent = Math.floor((Date.now() - State.startTime) \/ 1000);\r\n            \r\n            if (DOM.overlay) {\r\n                const title = DOM.overlay.querySelector('.overlay-title');\r\n                const desc = DOM.overlay.querySelector('.overlay-desc');\r\n                if (title) title.textContent = titleText;\r\n                if (desc) desc.innerHTML = `\u09ae\u09bf\u09b6\u09a8 \u09b6\u09c7\u09b7!&lt;br&gt;\u09b8\u09cd\u0995\u09cb\u09b0: &lt;b&gt;${toBn(State.score)}&lt;\/b&gt;&lt;br&gt;\u09b8\u09a0\u09bf\u0995\u09a4\u09be\u09b0 \u09b9\u09be\u09b0: &lt;b&gt;${toBn(accuracy)}%&lt;\/b&gt;`;\r\n                DOM.btnStart.textContent = &quot;\u0986\u09ac\u09be\u09b0 \u0996\u09c7\u09b2\u09c1\u09a8&quot;;\r\n                DOM.btnStart.classList.add('start-pulse');\r\n                DOM.overlay.classList.remove('hidden');\r\n            }\r\n\r\n            if(State.lives &gt; 0) AudioEngine.speak(&quot;\u0985\u09b8\u09be\u09a7\u09be\u09b0\u09a3! \u0997\u09be\u099b\u099f\u09bf \u09b8\u09ae\u09cd\u09aa\u09c2\u09b0\u09cd\u09a3 \u09ac\u09dc \u09b9\u09df\u09c7\u099b\u09c7\u0964&quot;);\r\n\r\n            if (window.GameController &amp;&amp; typeof window.GameController.saveScore === 'function') {\r\n                window.GameController.saveScore(State.score, timeSpent, { level: `Day6-Tree-Sub`, accuracy: accuracy });\r\n            }\r\n        }\r\n\r\n        DOM.cores.forEach(btn =&gt; {\r\n            if (btn) {\r\n                btn.addEventListener('pointerdown', (e) =&gt; {\r\n                    e.preventDefault(); handleAnswer(btn);\r\n                    if(navigator.vibrate) navigator.vibrate(15);\r\n                });\r\n            }\r\n        });\r\n\r\n        if (DOM.btnStart) {\r\n            DOM.btnStart.addEventListener('pointerdown', (e) =&gt; { e.preventDefault(); startGame(); });\r\n        }\r\n\r\n        resizeCanvas(); draw();\r\n    };\r\n\r\n    if (document.readyState === 'loading') {\r\n        document.addEventListener('DOMContentLoaded', initSimulator);\r\n    } else {\r\n        initSimulator();\r\n    }\r\n})();&lt;\/script&gt;&lt;\/body&gt;&lt;\/html&gt;\" sandbox=\"allow-scripts allow-forms allow-same-origin allow-pointer-lock\" allow=\"fullscreen; accelerometer; gyroscope\" allowfullscreen><\/iframe>\n        <\/div>\n    <\/div>\n    <script data-cfasync=\"false\">\n    (function() {\n        var wrap = document.getElementById('qsh-27072-377');\n        var btn  = document.getElementById('fs-btn-qsh-27072-377');\n        if (!wrap || !btn) return;\n        btn.addEventListener('click', function() {\n            if (!document.fullscreenElement) {\n                if (wrap.requestFullscreen) wrap.requestFullscreen();\n                else if (wrap.webkitRequestFullscreen) wrap.webkitRequestFullscreen();\n            } else {\n                if (document.exitFullscreen) document.exitFullscreen();\n            }\n        });\n        document.addEventListener('fullscreenchange', function() {\n            if (document.fullscreenElement === wrap) {\n                btn.classList.add('is-active');\n                btn.querySelector('span').textContent = 'Exit';\n            } else {\n                btn.classList.remove('is-active');\n                btn.querySelector('span').textContent = 'Expand';\n            }\n        });\n    })();\n    <\/script>\n    \n","protected":false},"excerpt":{"rendered":"<p>\u09ae\u09c7\u09a8\u09cd\u099f\u09be\u09b2 \u09ae\u09cd\u09af\u09be\u09a5 \u0995\u09cb\u09b0\u09cd\u09b8\u09c7\u09b0 \u09b7\u09b7\u09cd\u09a0 \u09a6\u09bf\u09a8\u09c7 \u09a4\u09cb\u09ae\u09be\u09a6\u09c7\u09b0 \u09b8\u09cd\u09ac\u09be\u0997\u09a4 \u099c\u09be\u09a8\u09be\u0987! \u09af\u09cb\u0997 \u09b6\u09c7\u0996\u09be\u09b0 \u09aa\u09b0 \u09ac\u09bf\u09af\u09bc\u09cb\u0997\u09c7 \u09b9\u09be\u09a4 \u09a6\u09bf\u09b2\u09c7 \u0985\u09a8\u09c7\u0995\u09c7\u0987 \u0986\u09ac\u09be\u09b0 \u0986\u0999\u09c1\u09b2 \u0997\u09cb\u09a8\u09be\u09b0 \u09aa\u09c1\u09b0\u09a8\u09cb \u0985\u09ad\u09cd\u09af\u09be\u09b8\u09c7 \u09ab\u09bf\u09b0\u09c7 \u09af\u09be\u09af\u09bc\u0964 \u0986\u099c\u0995\u09c7\u09b0 \u09aa\u09be\u09a0\u09c7\u09b0 \u09ae\u09c2\u09b2 \u09b2\u0995\u09cd\u09b7\u09cd\u09af \u09b9\u09b2\u09cb \u0986\u0999\u09c1\u09b2 \u0997\u09cb\u09a8\u09be \u09b8\u09ae\u09cd\u09aa\u09c2\u09b0\u09cd\u09a3 \u09ac\u09a8\u09cd\u09a7 \u0995\u09b0\u09c7 \u09ae\u09b8\u09cd\u09a4\u09bf\u09b8\u09cd\u0995\u0995\u09c7 \u09a6\u09cd\u09b0\u09c1\u09a4 \u0989\u09a4\u09cd\u09a4\u09b0 \u09a6\u09bf\u09a4\u09c7 \u09ac\u09be\u09a7\u09cd\u09af \u0995\u09b0\u09be\u0964 \u09ac\u09bf\u09af\u09bc\u09cb\u0997\u0995\u09c7 \u09b6\u09c1\u09a7\u09c1\u09ae\u09be\u09a4\u09cd\u09b0 \u2018\u09ac\u09be\u09a6 \u09a6\u09c7\u0993\u09af\u09bc\u09be\u2019 \u09b9\u09bf\u09b8\u09c7\u09ac\u09c7 \u09a8\u09be \u09a6\u09c7\u0996\u09c7, \u0986\u09ae\u09b0\u09be \u0986\u099c \u098f\u0995\u09c7 \u09a6\u09c1\u099f\u09bf \u09b8\u0982\u0996\u09cd\u09af\u09be\u09b0 \u2018\u09a6\u09c2\u09b0\u09a4\u09cd\u09ac\u2019 \u09ac\u09be \u09af\u09cb\u0997\u09c7\u09b0 \u0989\u09b2\u09cd\u099f\u09cb \u09aa\u09cd\u09b0\u0995\u09cd\u09b0\u09bf\u09af\u09bc\u09be [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13],"tags":[],"class_list":["post-27072","post","type-post","status-publish","format-standard","hentry","category-mental-math-tricks"],"_links":{"self":[{"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/posts\/27072","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/comments?post=27072"}],"version-history":[{"count":1,"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/posts\/27072\/revisions"}],"predecessor-version":[{"id":27073,"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/posts\/27072\/revisions\/27073"}],"wp:attachment":[{"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/media?parent=27072"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/categories?post=27072"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/qsh.in\/boards\/wbbse\/wp-json\/wp\/v2\/tags?post=27072"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}