html{background:#fff8e7}body{min-width:320px;margin:0;font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif}button:focus-visible{outline-offset:3px;outline:4px solid #ffe46d}:root{--navy-950:#061631;--navy-900:#08214a;--navy-800:#0d3468;--navy-700:#18518f;--cream:#fff8e7;--gold:#ffc341;--ink:#17324c}*{box-sizing:border-box}button{font:inherit}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.home-shell{min-height:100svh;color:var(--ink);background:var(--cream)}.home-nav{align-items:center;gap:10px;max-width:1200px;height:72px;margin:auto;padding:0 28px;font-size:15px;display:flex}.home-nav span:last-child{color:#7890a1;border-left:1px solid #d9e2e4;padding-left:10px}.brand-mark{color:#fff;background:#ed7e3d;border-radius:10px;place-items:center;width:30px;height:30px;display:grid}.home-hero{background:#dff2c7 url(/assets/garden-field-8C3Rnf4C.png) 50%/cover no-repeat;border-radius:36px;grid-template-columns:1fr 1fr;max-width:1200px;min-height:620px;margin:0 auto 44px;padding:76px 58px;display:grid;position:relative;overflow:hidden}.home-hero:after{content:"";background:#e1f7ffd1;position:absolute;inset:0}.hero-copy{z-index:2;max-width:540px;position:relative}.eyebrow{color:#d96b36;letter-spacing:.08em;font-size:13px;font-weight:800}.hero-copy h1{color:#13365a;letter-spacing:-.06em;margin:14px 0 6px;font-size:clamp(40px,5vw,67px);line-height:1.07}.hero-headline{color:#27617c;letter-spacing:-.045em;margin:0 0 20px;font-size:clamp(23px,2.7vw,36px);line-height:1.13}.hero-copy p{color:#42647b;max-width:470px;font-size:18px;line-height:1.7}.start-button{color:#fff;cursor:pointer;background:#e6763b;border:0;border-radius:18px;margin-top:28px;padding:17px 25px;font-weight:900;box-shadow:0 8px #be572a}.start-button span{margin-left:8px;font-size:22px}.home-notes{color:#517184;flex-wrap:wrap;gap:14px;margin-top:32px;font-size:13px;font-weight:700;display:flex}.hero-garden{z-index:2;background:url(/assets/garden-field-8C3Rnf4C.png) 50%/cover no-repeat;border-radius:38px;min-height:420px;position:relative;box-shadow:inset 0 0 0 7px #ffffff73}.hero-sun{color:#714500;background:#ffd555;border-radius:50%;place-items:center;width:65px;height:65px;font-size:28px;font-weight:900;animation:3.5s ease-in-out infinite float;display:grid;position:absolute;box-shadow:0 0 0 7px #ffb52f,0 11px 22px #f39d2775}.sun-one{top:60px;left:70px}.sun-two{animation-delay:.7s;top:132px;left:220px}.sun-three{animation-delay:1.2s;top:46px;right:65px}.hero-plant,.hero-monster{display:none}.course-preview{justify-content:space-between;align-items:end;gap:24px;max-width:1100px;margin:0 auto;padding:24px 24px 70px;display:flex}.course-preview h2{max-width:550px;margin:8px 0 0;font-size:28px;line-height:1.25}.course-preview-actions{justify-items:end;gap:14px;display:grid}.chapter-pills{flex-wrap:wrap;gap:9px;max-width:420px;display:flex}.chapter-pills span{color:#466272;background:#e8f3e0;border-radius:999px;padding:9px 12px;font-size:13px;font-weight:800}.map-button,.text-button{cursor:pointer;border:0;font-weight:900}.map-button{color:#1b5f87;background:#dcefff;border-radius:12px;padding:11px 15px}.map-shell{min-height:100svh;color:var(--ink);background:#e9f7e4;padding:30px}.map-header{justify-content:space-between;align-items:center;gap:20px;max-width:1150px;margin:0 auto 28px;display:flex}.map-header h1{margin:3px 0 0;font-size:33px}.text-button{color:#35617f;background:#fff;border-radius:10px;padding:10px 13px}.map-progress{color:#815d14;background:#fff0a6;border-radius:999px;padding:9px 12px;font-size:13px;font-weight:900}.chapter-map{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:13px;max-width:1150px;margin:auto;display:grid}.level-node{text-align:left;border-radius:18px;min-height:100px;padding:13px}.level-node strong,.level-node span,.level-node em{display:block}.level-node strong{font-size:16px}.level-node span{margin-top:6px;font-size:12px}.level-node em{margin-top:8px;font-size:12px;font-style:normal}.available{color:#1e5537;cursor:pointer;background:#d9f7a2;border:3px solid #62b84a;box-shadow:0 5px #438d3a}.available em{color:#347038}.locked{color:#82919b;background:#f4f6f4;border:2px solid #e0e6e8}.locked i{margin-top:7px;font-size:12px;font-style:normal;display:block}.game-shell{color:#fff;background:var(--navy-950);grid-template-rows:82px minmax(360px,1fr) 286px;min-width:980px;height:100svh;min-height:720px;display:grid;overflow:hidden}.game-topbar{z-index:20;color:#fff;background:var(--navy-950);border-bottom:4px solid #164a82;grid-template-columns:56px 250px 170px 1fr auto;align-items:center;gap:14px;padding:8px 28px;display:grid;position:relative;box-shadow:0 6px 16px #000c2559}.game-brand{color:#ffcd46;letter-spacing:.04em;text-shadow:0 3px #81451d,0 0 18px #ffbe3142;align-self:stretch;align-items:center;padding-left:10px;font-size:clamp(27px,2.2vw,38px);font-weight:950;display:flex}.level-pill{color:#fff7dd;white-space:nowrap;background:#0a244c;border:2px solid #31598d;border-radius:17px;justify-self:center;padding:13px 26px;font-size:21px;font-weight:900;box-shadow:inset 0 0 0 2px #030f29b3}.chapter-title{letter-spacing:.12em;color:#fffdf2;justify-self:center;margin:0;font-size:26px}.icon-button{color:#fff;cursor:pointer;background:#173d70;border:2px solid #5578aa;border-radius:15px;place-items:center;width:46px;height:46px;display:grid;box-shadow:inset 0 -4px #0a244b,0 3px 8px #00000040}.icon-button svg{width:25px;height:25px}.back-button{width:54px;height:54px}.top-actions{align-items:center;gap:12px;display:flex}.sun-counter{color:#fff0bc;background:#0a244c;border:2px solid #31598d;border-radius:19px;justify-content:center;align-items:center;gap:12px;min-width:138px;height:52px;font-size:31px;font-weight:950;line-height:1;display:flex}.sun-counter svg{color:#ffc52f;filter:drop-shadow(0 0 8px #ffbd2b8c);width:38px;height:38px}.garden-field{background-position:50% 54%;background-size:cover;min-height:0;position:relative;overflow:hidden;box-shadow:inset 0 -12px 30px #14300f2e}.garden-field:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 45px #07211442}.garden-lanes{z-index:2;grid-template-rows:repeat(5,1fr);display:grid;position:absolute;inset:21% 0 3%}.lane{min-height:0;position:relative}.lane-number{z-index:4;color:#fff8dc;background:#9a5c27;border:3px solid #78421c;border-radius:12px;place-items:center;width:43px;height:43px;font-size:24px;font-weight:900;display:grid;position:absolute;top:50%;left:3.2%;transform:translateY(-50%);box-shadow:inset 0 0 0 3px #bd8241,0 4px 5px #222f0f59}.plant-sprite{z-index:5;aspect-ratio:1;filter:drop-shadow(0 8px 5px #1f300e40);place-items:center;height:128%;display:grid;position:absolute;top:50%;transform:translateY(-50%)}.plant-sprite img{object-fit:contain;width:100%;height:100%}.shooter-sprite{left:18%}.wall-sprite{left:56%}.garden-intruder{z-index:6;object-fit:contain;filter:drop-shadow(0 8px 5px #1f182d40);width:auto;height:142%;transition:right .45s ease-out;animation:2.3s ease-in-out infinite intruder-bob;position:absolute;top:50%;transform:translateY(-50%)}.seed-shot{z-index:8;color:#dfff42;filter:drop-shadow(0 0 7px #f4ff63);width:24px;height:24px;animation:1.15s linear infinite shoot;position:absolute;top:46%;left:66%}.target-bubble{z-index:12;text-align:center;color:#452a11;place-content:start center;justify-items:center;width:168px;min-height:175px;animation:4s ease-in-out infinite target-float;display:grid;position:absolute;top:3%;left:50%;transform:translate(-50%)}.sun-target{z-index:-1;color:#f8b92c;filter:drop-shadow(0 8px 7px #81530f47);width:128px;height:128px;position:absolute;top:0;left:50%;transform:translate(-50%)}.sun-target svg{width:100%;height:100%}.target-input{color:#382615;background:#fff8df;border-radius:50%;justify-content:center;align-items:center;width:92px;height:78px;margin-top:28px;font-size:52px;font-weight:900;line-height:1;display:flex;box-shadow:inset 0 0 0 3px #e5b74e}.target-input strong{color:#55a632}.target-word{color:#5b3718;background:#fff1bd;border-radius:10px;align-items:center;gap:5px;padding:5px 9px;font-size:15px;font-weight:900;display:flex;position:absolute;top:106px}.target-tip{color:#513117;white-space:nowrap;background:#f5d68c;border:2px solid #9f652b;border-radius:10px;min-width:180px;padding:9px 14px;font-size:13px;font-weight:900;position:absolute;top:132px;box-shadow:inset 0 0 0 2px #ffeab9,0 4px 7px #4c330f40}.learning-panel{z-index:30;color:#fff;background:var(--navy-950);border-top:5px solid #2f5e99;border-radius:28px 28px 0 0;grid-template-columns:minmax(260px,25%) minmax(500px,1fr) minmax(290px,25%);gap:16px;padding:14px 22px 18px;display:grid;position:relative;box-shadow:0 -5px #071b3e,0 -14px 26px #000e2952,inset 0 0 0 2px #153a6e}.coach-card{background:#08244f;border:2px solid #24518b;border-radius:22px;grid-template-rows:1fr 70px;grid-template-columns:46% 54%;min-width:0;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 24px #1b569140}.coach-tutor{object-fit:contain;filter:drop-shadow(0 7px 5px #00000047);grid-area:1/1;place-self:end center;width:145px;height:145px}.coach-message{color:#3d3021;background:#fff5d7;border-radius:15px;grid-area:1/2;align-self:center;margin:8px 12px 6px 0;padding:18px 14px;font-size:16px;font-weight:800;line-height:1.45;position:relative;box-shadow:inset 0 0 0 2px #dfc58e,0 5px 12px #0003}.coach-message:before{content:"";border:8px solid #0000;border-left-width:0;border-right:12px solid #fff5d7;position:absolute;top:45%;left:-12px}.coach-message strong,.coach-message span{display:block}.wave-meter{color:#fff6d6;border-top:2px solid #1a447b;grid-area:2/1/auto/-1;grid-template-columns:auto 1fr;align-content:center;gap:8px 12px;padding:8px 18px 10px;display:grid}.wave-meter span{font-weight:900}.wave-meter strong{color:#ffd761;font-size:20px}.wave-meter i{background:#04142f;border-radius:999px;grid-column:1/-1;height:12px;padding:2px;overflow:hidden;box-shadow:inset 0 0 0 2px #173c6b}.wave-meter b{border-radius:inherit;background:#a7d642;height:100%;transition:width .35s;display:block}.keyboard-visual{align-self:center;min-width:0;padding:4px 8px 5px;position:relative}.keyboard-row{justify-content:center;gap:clamp(4px,.45vw,8px);margin:4px 0;display:flex}.keyboard-row:nth-child(3){transform:translate(8px)}.keyboard-row:nth-child(4){transform:translate(22px)}.keycap{z-index:2;color:#f5f8ff;background:#27466f;border:2px solid #4c6c96;border-radius:7px;place-items:center;width:clamp(36px,3.5vw,53px);height:39px;font-size:clamp(14px,1.25vw,20px);font-weight:800;display:grid;position:relative;box-shadow:inset 0 -5px #142c50,0 3px 4px #00000059}.keyboard-row:first-child .keycap{color:#dce9ff;height:32px;font-size:13px}.active-key{z-index:4;color:#fff;background:#246eef;border-color:#8af3ff;transform:translateY(-1px);box-shadow:inset 0 -5px #1550bc,0 0 0 3px #18d7ff,0 0 18px #31dffb}.space-key{color:#a9bdd9;width:min(44%,330px);font-size:12px}.hand-guide{pointer-events:none;z-index:8;filter:drop-shadow(0 7px 5px #00000038);transform-origin:bottom;width:255px;transition:left .25s,right .25s,bottom .25s;position:absolute;bottom:-112px}.hand-guide img{width:100%;height:auto}.hand-guide.left{left:3%}.hand-guide.right{right:3%;transform:scaleX(-1)}.hand-guide.upper{bottom:-88px}.hand-guide.lower{bottom:-133px}.hand-guide.space{bottom:-152px}.stats-grid{grid-template-rows:1fr 1fr 58px;grid-template-columns:1fr 1fr;gap:9px;min-width:0;display:grid}.stat-card{background:#0b2a58;border:2px solid #244d84;border-radius:15px;grid-template-rows:18px 1fr;grid-template-columns:28px 1fr;align-items:center;padding:10px 12px;display:grid;box-shadow:inset 0 0 16px #2f69a621}.stat-card svg{grid-row:1;width:22px;height:22px}.stat-card small{color:#d9e9ff;grid-column:2;font-size:12px;font-weight:800}.stat-card strong{color:#70bcff;grid-column:1/-1;font-size:clamp(21px,2vw,30px);font-weight:900;line-height:1}.stat-card em{color:#d7f894;margin-left:6px;font-size:10px;font-style:normal}.stat-card.time svg{color:#54b5ff}.stat-card.speed svg,.stat-card.speed strong{color:#a7df65}.stat-card.accuracy svg,.stat-card.accuracy strong{color:#c68dff}.stat-card.combo svg,.stat-card.combo strong{color:#ffb052}.stat-card.sunshine{grid-column:1/-1;grid-template-rows:1fr;grid-template-columns:32px 1fr auto}.stat-card.sunshine svg{color:#ffc532;grid-row:1}.stat-card.sunshine small{grid-column:2}.stat-card.sunshine strong{color:#ffd04e;grid-column:3;font-size:31px}.pause-card,.result-card{z-index:40;text-align:center;color:#17324c;background:#fffdf4;border:4px solid #315d91;border-radius:25px;width:320px;padding:24px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 20px 55px #173b6175}.pause-card>img{object-fit:contain;width:82px;height:82px}.pause-card>svg,.result-card>svg{color:#efaa2b;width:48px;height:48px}.pause-card h2,.result-card h2{margin:6px 0}.pause-card p,.result-card p{color:#607a89}.pause-card button,.result-card button{color:#fff;cursor:pointer;background:#e5763d;border:0;border-radius:12px;margin-top:16px;padding:10px 16px;font-weight:800}.star-row{color:#ffbe36;letter-spacing:4px;margin:6px 0;font-size:25px}@keyframes float{50%{transform:translateY(-11px)rotate(3deg)}}@keyframes target-float{50%{transform:translate(-50%,8px)}}@keyframes intruder-bob{50%{transform:translateY(calc(-50% - 5px))}}@keyframes shoot{0%{opacity:0;transform:translate(0)scale(.65)}18%{opacity:1}85%,to{opacity:0;transform:translate(170px)scale(.4)}}@media (width<=1150px){.game-shell{grid-template-rows:76px minmax(340px,1fr) 260px}.game-topbar{grid-template-columns:50px 190px 145px 1fr auto;gap:9px;padding-inline:18px}.game-brand{font-size:27px}.level-pill{padding-inline:18px;font-size:17px}.chapter-title{font-size:22px}.learning-panel{grid-template-columns:230px minmax(470px,1fr) 250px;gap:10px;padding-inline:14px}.coach-tutor{width:115px;height:115px}.coach-message{padding:13px 10px;font-size:13px}.hand-guide{width:225px;bottom:-105px}}@media (width<=760px){.home-hero{grid-template-columns:1fr;min-height:auto;margin:0 18px 38px;padding:48px 28px}.hero-garden{min-height:320px;margin-top:40px}.course-preview{display:block}.course-preview-actions{justify-items:start;margin-top:20px}.map-shell{padding:20px}.map-header{flex-wrap:wrap;align-items:flex-start}.chapter-map{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}