:root{--bg: #f6fdf8;font-family:Nunito,Segoe UI,sans-serif;font-size:16px;line-height:1.5;color:#1b4332;background-color:var(--bg)}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg)}#root{min-height:100vh}a{color:#40916c;text-decoration:none}button{font-family:inherit}@media (min-width: 1200px){:root{font-size:18px}}.cricket-wrapper{display:inline-block;transition:transform .1s}.cricket-wrapper.jumping{animation:bounce .48s ease-in-out 2}.cricket-wrapper.done{animation:glow-pulse 1.8s ease-in-out infinite}.notes-float{animation:notes-bob 2s ease-in-out infinite;transform-box:fill-box;transform-origin:center bottom}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes glow-pulse{0%,to{filter:drop-shadow(0 0 4px rgba(82,183,136,.4))}50%{filter:drop-shadow(0 0 12px rgba(82,183,136,.85))}}@keyframes notes-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.home{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:32px 16px;gap:40px}.home-hero{display:flex;flex-direction:column;align-items:center;gap:12px;animation:fadeUp .5s ease both}.home-title{font-size:3rem;font-weight:900;color:#1b4332;margin:0;letter-spacing:-.02em}.home-subtitle{font-size:1.1rem;color:#52b788;margin:0;font-weight:600}.home-buttons{display:flex;flex-direction:column;gap:14px;width:200px;animation:fadeUp .5s ease .18s both}.home-btn{padding:11px 22px;border-radius:12px;border:none;cursor:pointer;font-size:.95rem;font-weight:800;transition:transform .12s,box-shadow .12s;box-shadow:0 2px 8px #00000014;font-family:inherit}.home-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0000001f}.home-btn:active{transform:translateY(0)}.btn-learn{background:#d8f3dc;color:#1b4332}.btn-play{background:#40916c;color:#fff}.btn-practice{background:#f4a261;color:#4a2000}@media (max-width: 480px){.home-title{font-size:2.5rem}.home-subtitle{font-size:.9rem}}.next-runs{background:#f0faf4;border:1.5px solid #b7e4c7;border-radius:12px;padding:14px 18px;margin-top:16px}.next-runs-label{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#40916c;margin:0 0 10px}.next-runs-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.next-runs-list li{display:flex;align-items:center;gap:10px;font-size:.85rem;color:#1b4332}.next-runs-list li.first .run-date{font-weight:700}.run-index{width:20px;height:20px;background:#d8f3dc;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;color:#40916c;flex-shrink:0}.next-runs-empty{font-size:.85rem;color:#74c69d;margin:0}.cricket-meadow{margin:24px 0 4px;border-radius:14px;overflow:hidden}.meadow-hop{animation:meadow-hop 14s ease-in-out infinite}@keyframes meadow-hop{0%{transform:translateY(0)}2.5%{transform:translateY(-28px)}5%{transform:translateY(0)}to{transform:translateY(0)}}.tutorial{min-height:100vh;display:flex;flex-direction:column;max-width:680px;margin:0 auto;padding:0 16px 32px}.tut-header{display:flex;align-items:center;gap:12px;padding:16px 0;position:sticky;top:0;background:var(--bg);z-index:10;animation:fadeUp .4s ease both}.back-btn{background:none;border:none;cursor:pointer;font-size:.9rem;font-weight:700;color:#40916c;padding:4px 0;white-space:nowrap;font-family:inherit}.back-btn:hover{color:#1b4332}.tut-progress-bar{flex:1;height:8px;background:#d8f3dc;border-radius:4px;overflow:hidden}.tut-progress-fill{height:100%;background:#40916c;border-radius:4px;transition:width .3s ease}.tut-counter{font-size:.8rem;font-weight:700;color:#52b788;white-space:nowrap}.tut-card{flex:1;padding:28px 0 8px;animation:fadeUp .3s ease both}@media (max-width: 500px){.tut-card{padding-top:0}}@media (min-width: 1200px){.tutorial{max-width:820px}}.tut-title{font-size:1.7rem;font-weight:900;color:#1b4332;margin:0 0 20px}.tut-body p{font-size:1rem;color:#2d3748;line-height:1.7;margin:0 0 14px}.tut-body code{background:#d8f3dc;color:#1b4332;padding:1px 6px;border-radius:5px;font-family:Courier New,monospace;font-size:.9em}.cron-anatomy{background:#1b4332;border-radius:16px;padding:20px;margin:20px 0;display:flex;justify-content:center;gap:8px}.anatomy-col{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1}.anatomy-field{background:#40916c;color:#fff;font-family:Courier New,monospace;font-size:1.4rem;font-weight:700;padding:8px 0;border-radius:10px;width:100%;text-align:center}.anatomy-label{font-size:.65rem;font-weight:800;color:#95d5b2;text-align:center;line-height:1.2}.anatomy-range{font-size:.6rem;color:#52b788;text-align:center}.tut-example{background:#f0faf4;border:1.5px solid #b7e4c7;border-radius:14px;padding:18px;margin:20px 0}.example-expr-row{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}.expr-field{background:#d8f3dc;color:#1b4332;font-family:Courier New,monospace;font-size:1.15rem;font-weight:700;padding:6px 12px;border-radius:8px}.expr-field.highlighted{background:#40916c;color:#fff}.example-desc{font-size:.85rem;color:#2d6a4f;font-weight:600;margin:0 0 4px}.tut-table{width:100%;border-collapse:collapse;margin:16px 0;font-size:.9rem}.tut-table th{background:#1b4332;color:#fff;padding:8px 12px;text-align:left;font-weight:700}.tut-table td{padding:8px 12px;border-bottom:1px solid #d8f3dc;color:#1b4332}.tut-table tr:nth-child(2n) td{background:#f0faf4}.tut-table td code{background:#d8f3dc;color:#1b4332;padding:1px 6px;border-radius:4px;font-family:Courier New,monospace}.tut-final-cricket{display:flex;justify-content:center;margin:8px 0 4px}.tut-summary{margin:20px 0}.syntax-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.syntax-item{background:#f0faf4;border:1.5px solid #b7e4c7;border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:4px}.syntax-item code{font-family:Courier New,monospace;font-size:1.1rem;font-weight:700;color:#1b4332;background:#d8f3dc;padding:2px 8px;border-radius:5px;align-self:flex-start}.syntax-item span{font-size:.78rem;color:#2d6a4f;font-weight:600}.tut-nav{display:flex;gap:12px;padding-top:16px;animation:fadeUp .4s ease .2s both}.tut-btn{flex:1;padding:14px;border-radius:12px;border:none;font-size:1rem;font-weight:700;cursor:pointer;font-family:inherit;transition:transform .1s,box-shadow .1s}.tut-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.tut-btn:disabled{opacity:.35;cursor:default}.tut-btn.primary{background:#40916c;color:#fff}.tut-btn.secondary{background:#d8f3dc;color:#1b4332}.levels-page{max-width:760px;margin:0 auto;padding:0 16px 48px}.levels-header{display:flex;align-items:center;gap:16px;padding:20px 0 12px;position:sticky;top:0;background:var(--bg);z-index:10;animation:fadeUp .4s ease both}.levels-title{font-size:1.5rem;font-weight:900;color:#1b4332;margin:0}.chapters{display:flex;flex-direction:column;gap:32px}.chapter{background:#fff;border-radius:18px;padding:20px;box-shadow:0 2px 12px #0000000f}.chapter-header{display:flex;align-items:center;gap:14px;margin-bottom:18px}.chapter-emoji{font-size:2rem;flex-shrink:0}.chapter-title{font-size:1.1rem;font-weight:800;color:#1b4332;margin:0 0 3px}.chapter-desc{font-size:.82rem;color:#52b788;font-weight:600;margin:0}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media (max-width: 480px){.level-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1200px){.levels-page{max-width:920px}}.level-btn{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 6px;border-radius:10px;border:2px solid #d8f3dc;background:#f0faf4;cursor:pointer;transition:transform .1s,box-shadow .1s,border-color .1s;font-family:inherit;animation:fadeUp .35s ease both;animation-delay:calc(var(--i, 0) * .02s)}.level-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;border-color:#52b788}.level-btn.done{background:#d8f3dc;border-color:#40916c}.level-btn.locked{opacity:.45;cursor:default}.level-num{font-size:.7rem;font-weight:800;color:#74c69d;letter-spacing:.05em}.level-icon{line-height:1}.level-btn.done .level-icon{color:#40916c;font-size:1.5rem;font-weight:900}.level-name{font-size:.72rem;font-weight:700;color:#1b4332;text-align:center;line-height:1.3}.level-play{max-width:960px;margin:0 auto;padding:0 16px 48px;min-height:100vh}.play-header{display:flex;align-items:center;gap:16px;padding:20px 0 12px;position:sticky;top:0;background:var(--bg);z-index:10;animation:fadeUp .4s ease both}.play-level-label{font-size:.85rem;font-weight:800;color:#52b788;text-transform:uppercase;letter-spacing:.08em}.play-content{display:flex;gap:32px;align-items:flex-start}.play-left{flex:1;min-width:0;display:flex;flex-direction:column;gap:18px}.play-right{width:260px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:12px;padding-top:12px;animation:fadeUp .4s ease .1s both}.story-card{background:#fff;border-radius:16px;padding:22px;box-shadow:0 2px 10px #0000000f;animation:fadeUp .4s ease .05s both}.play-title{font-size:1.2rem;font-weight:900;color:#1b4332;margin:0 0 10px}.play-story{font-size:1rem;color:#2d3748;margin:0;line-height:1.65}.field-count-badge{display:inline-block;margin-top:12px;background:#1b4332;color:#95d5b2;font-size:.75rem;font-weight:800;padding:3px 10px;border-radius:20px}.fields-input{background:#fff;border-radius:16px;padding:20px;box-shadow:0 2px 10px #0000000f;animation:fadeUp .4s ease .12s both}.input-label{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:#52b788;margin:0 0 14px}.fields-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:8px}.field-col{display:flex;flex-direction:column;gap:5px;animation:fadeUp .3s ease both;animation-delay:calc(.18s + var(--i, 0) * .05s)}.field-col.inactive{opacity:.3}.field-label{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#40916c;text-align:center}.field-input{width:100%;padding:8px 4px;text-align:center;border:2px solid #b7e4c7;border-radius:10px;font-family:Courier New,monospace;font-size:1.1rem;font-weight:700;color:#1b4332;background:#f0faf4;outline:none;box-sizing:border-box;transition:border-color .15s}.field-input:focus{border-color:#40916c}.field-input::placeholder{color:#a8d5bc;font-weight:400}.field-input.locked{background:#d8f3dc;color:#74c69d;cursor:default}.expr-preview{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid #d8f3dc}.expr-preview-label{font-size:.75rem;font-weight:700;color:#52b788}.expr-preview-val{font-family:Courier New,monospace;font-size:1rem;font-weight:700;color:#1b4332;background:#d8f3dc;padding:3px 10px;border-radius:6px;min-width:0;word-break:break-all;white-space:normal}.full-input{background:#fff;border-radius:16px;padding:20px;box-shadow:0 2px 10px #0000000f;animation:fadeUp .4s ease .12s both}.full-expr-input{width:100%;padding:14px 16px;border:2px solid #b7e4c7;border-radius:12px;font-family:Courier New,monospace;font-size:1.2rem;font-weight:700;color:#1b4332;background:#f0faf4;outline:none;box-sizing:border-box;transition:border-color .15s}.full-expr-input::placeholder{color:#cdcdcd;font-weight:400}.full-expr-input:focus{border-color:#40916c}.action-row{display:flex;gap:10px;animation:fadeUp .4s ease .22s both}.hint-btn{padding:12px 18px;border-radius:10px;border:2px solid #d8f3dc;background:#fff;color:#40916c;font-size:.9rem;font-weight:700;cursor:pointer;font-family:inherit;transition:border-color .15s}.hint-btn:hover{border-color:#52b788}.submit-btn{flex:1;padding:12px;border-radius:10px;border:none;background:#40916c;color:#fff;font-size:1rem;font-weight:800;cursor:pointer;font-family:inherit;transition:transform .1s}.submit-btn:disabled{opacity:.5;cursor:default}.hint-box{background:#fff9ec;border:1.5px solid #f4a261;border-radius:10px;padding:14px 16px;font-size:.9rem;color:#7c4a0a;line-height:1.6}.hint-box code{font-family:Courier New,Courier,monospace;background:#fdecc8;padding:1px 5px;border-radius:4px;font-size:.88em;color:#5a3000}.next-actions{display:flex;gap:10px}.next-btn{flex:1;padding:13px;border-radius:10px;border:none;font-size:.95rem;font-weight:800;cursor:pointer;font-family:inherit;transition:transform .1s}.next-btn.primary{background:#40916c;color:#fff}.next-btn.secondary{background:#d8f3dc;color:#1b4332}.cricket-area{display:flex;flex-direction:column;align-items:center;gap:6px}.chirp-label{font-size:.9rem;font-weight:700;color:#40916c;margin:0;animation:fadeIn .3s}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.next-run-mobile-slot.show-on-correct{display:block}@media (min-width: 1200px){.level-play{max-width:1140px}.play-right{width:300px}}@media (max-width: 640px){.play-content{flex-direction:column;gap:16px}.play-right{display:none}.cricket-mobile-slot{display:flex;flex-direction:column;align-items:center;gap:8px;padding:4px 0 0;margin-bottom:-10px}.next-run-mobile-slot{display:block}.fields-row{display:flex;flex-direction:column;gap:8px}.field-col{flex-direction:row;align-items:center;gap:12px}.field-label{text-align:right;width:90px;flex-shrink:0}.field-input{flex:1;max-width:160px;padding:8px 12px;text-align:left}.action-row{flex-direction:column}.hint-btn{width:100%}.next-actions{flex-direction:column}}@keyframes fadeUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.practice-page{max-width:900px;margin:0 auto;padding:0 16px 48px;min-height:100vh}.practice-header{display:flex;align-items:center;gap:16px;padding:20px 0 12px;position:sticky;top:0;background:var(--bg);z-index:10;animation:fadeUp .4s ease both}.practice-title{font-size:1.3rem;font-weight:900;color:#1b4332;margin:0;flex:1}.score-badge{background:#40916c;color:#fff;font-size:.85rem;font-weight:800;padding:4px 14px;border-radius:20px}.practice-content{display:flex;gap:28px;align-items:flex-start}.practice-left{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px}.practice-right{width:240px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;gap:12px;padding-top:12px;animation:fadeUp .4s ease .1s both}.practice-card{background:#fff;border-radius:16px;padding:22px;box-shadow:0 2px 10px #0000000f;animation:fadeUp .35s ease both}.q-label{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:#f4a261;margin:0 0 8px}.q-prompt{font-size:1.05rem;color:#1b4332;font-weight:700;line-height:1.5;margin:0}.write-section{background:#fff;border-radius:14px;padding:18px;box-shadow:0 2px 8px #0000000f;animation:fadeUp .35s ease .08s both}.write-input{width:100%;padding:13px 16px;border:2px solid #b7e4c7;border-radius:10px;font-family:Courier New,monospace;font-size:1.2rem;font-weight:700;color:#1b4332;background:#f0faf4;outline:none;box-sizing:border-box;transition:border-color .15s}.write-input::placeholder{color:#cdcdcd;font-weight:400}.write-input:focus{border-color:#40916c}.write-input:disabled{background:#f5f5f5;border-color:#d0d0d0;color:#888;cursor:not-allowed}.field-hint-row{display:flex;gap:6px;margin:8px 0 0;flex-wrap:wrap}.field-hint-item{font-size:.68rem;font-weight:700;color:#74c69d;background:#f0faf4;border:1px solid #d8f3dc;padding:2px 8px;border-radius:20px}.mc-section{display:flex;flex-direction:column;gap:10px}.mc-opt{display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:12px;border:2px solid #d8f3dc;background:#fff;cursor:pointer;font-family:inherit;text-align:left;transition:border-color .12s,transform .08s;animation:fadeUp .3s ease both;animation-delay:calc(.08s + var(--i, 0) * .05s)}.mc-opt:hover:not(:disabled){border-color:#52b788;transform:translateY(-1px)}.mc-opt.selected{border-color:#40916c;background:#f0faf4}.mc-opt.correct{border-color:#40916c;background:#d8f3dc}.mc-opt.wrong{border-color:#fca5a5;background:#ffe5e5}.mc-opt.missed{border-color:#52b788;border-style:dashed;background:#f0faf4}.mc-opt.missed .mc-letter{background:#74c69d;color:#fff}.mc-opt:disabled{cursor:default;transform:none}.multi-hint{font-size:.75rem;font-weight:700;color:#40916c;margin:0 0 2px;text-transform:uppercase;letter-spacing:.05em}.mc-letter{width:26px;height:26px;border-radius:50%;background:#d8f3dc;color:#1b4332;font-size:.75rem;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}.mc-opt.correct .mc-letter{background:#40916c;color:#fff}.mc-opt.wrong .mc-letter{background:#fca5a5;color:#7f1d1d}.mc-code{font-family:Courier New,monospace;font-size:1rem;font-weight:700;color:#1b4332}.mc-text-plain{font-size:.95rem;font-weight:600;color:#1b4332;font-family:inherit}.submit-btn{padding:13px;border-radius:10px;border:none;background:#f4a261;color:#4a2000;font-size:1rem;font-weight:800;cursor:pointer;font-family:inherit;transition:transform .1s}.submit-btn:hover:not(:disabled){transform:translateY(-1px)}.submit-btn:disabled{opacity:.4;cursor:default}.feedback{padding:14px 16px;border-radius:10px;font-size:.95rem;font-weight:600}.feedback.correct{background:#d8f3dc;color:#1b4332;border:1.5px solid #52b788}.feedback.wrong{background:#ffe5e5;color:#7f1d1d;border:1.5px solid #fca5a5}.feedback.wrong code{background:#fecaca;padding:1px 6px;border-radius:4px;font-family:Courier New,monospace}.feedback.invalid{background:#fef3c7;color:#78350f;border:1.5px solid #fcd34d}.next-btn{padding:13px;border-radius:10px;border:none;background:#40916c;color:#fff;font-size:1rem;font-weight:800;cursor:pointer;font-family:inherit;transition:transform .1s}.next-btn:hover{transform:translateY(-1px)}.cricket-mobile-slot,.next-run-mobile-slot{display:none}@media (min-width: 1200px){.practice-page{max-width:1080px}.practice-right{width:280px}}@media (max-width: 640px){.practice-content{flex-direction:column;align-items:stretch}.practice-right{display:none}.cricket-mobile-slot{display:flex;justify-content:center;margin-bottom:-10px}.next-run-mobile-slot{display:block}}