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{--ink:#17324c;--blue:#153d73;--navy:#102b58;--green:#76b82a;--grass:#a6dc55;--gold:#ffc447;--cream:#fff8e7}*{box-sizing:border-box}button{font:inherit}.home-shell,.game-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:linear-gradient(140deg,#f8ba38,#ff7859);border-radius:10px;place-items:center;width:30px;height:30px;display:grid}.home-hero{background:linear-gradient(135deg,#d4f1fc,#effbd7 55%,#a8d943);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}.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{background:linear-gradient(#72c9f0 0 36%,#e4f5bd 36% 44%,#8ccd45 44%);border-radius:38px;min-height:420px;position:relative;box-shadow:inset 0 0 0 7px #ffffff73}.hero-garden:after{content:"";background:repeating-linear-gradient(0deg,#0000 0 62px,#ffffff73 63px 66px);position:absolute;inset:45% 0 0}.hero-sun{z-index:2;color:#714500;background:radial-gradient(circle,#fff8b3 0 35%,#ffbd2f 37% 100%);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 #ffce4d,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{z-index:2;color:#fff;background:radial-gradient(circle at 36% 30%,#d9fb77 0 8%,#75bf2f 9% 62%,#3d7e27 64%);border:5px solid #397a2a;border-radius:48% 48% 42% 42%;place-items:center;width:76px;height:76px;font-size:32px;display:grid;position:absolute;box-shadow:inset -8px -8px #438d2a}.hero-plant.one{bottom:58px;left:57px}.hero-plant.two{bottom:130px;left:180px;transform:scale(.83)}.hero-monster{z-index:2;color:#5b2c34;background:#f47f62;border:5px solid #b84c51;border-radius:48% 48% 40% 42%;padding:17px 15px;font-size:28px;font-weight:900;position:absolute;bottom:60px;right:58px}.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:linear-gradient(#dcf4ff,#fff9e8 42%);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:linear-gradient(135deg,#e8ffc3,#b9ea72);border:3px solid #62b84a;box-shadow:0 5px #438d3a}.available em{color:#fff}.locked{color:#82919b;background:#f4f6f4;border:2px solid #e0e6e8}.locked i{margin-top:7px;font-size:12px;font-style:normal;display:block}.game-shell{background:#d5f2ff;overflow:hidden}.game-topbar{color:#fff;background:linear-gradient(100deg,#132f64,#2461a0);justify-content:space-between;align-items:center;gap:16px;height:78px;padding:0 26px;display:flex}.icon-button{color:#fff;cursor:pointer;background:#245692;border:2px solid #699de0;border-radius:14px;width:44px;height:44px;font-weight:900}.back-button{font-size:25px}.level-progress{align-items:center;gap:12px;margin-right:auto;display:flex}.level-progress strong,.level-progress span{display:block}.level-progress span{color:#c8e6ff;margin-top:4px;font-size:12px}.level-badge{background:#ffbe38;border-radius:13px;place-items:center;width:38px;height:38px;font-weight:900;color:#5d3b00!important;font-size:17px!important;display:grid!important}.top-actions{align-items:center;gap:9px;display:flex}.sun-counter{color:#fff6a8;background:#103563;border-radius:14px;min-width:92px;padding:9px 13px;font-weight:900}.sun-counter span{margin-right:6px;font-size:20px}.garden-field{background:linear-gradient(#75c9f0 0 39%,#e7f7c8 39% 47%,#83c83e 47%);min-height:calc(100svh - 278px);position:relative;overflow:hidden}.garden-field:before{content:"";opacity:.55;background:radial-gradient(circle at 10% 21%,#fff 0 4px,#0000 5px) 0 0/115px 100px,radial-gradient(circle at 74% 13%,#fff 0 3px,#0000 4px) 0 0/90px 90px,linear-gradient(90deg,#ffffff59 0 2px,#0000 2px) 0 0/240px 100%;position:absolute;inset:0}.sky-sparkles{text-align:center;color:#fffbd0;letter-spacing:30px;width:100%;font-size:21px;position:absolute;top:20px}.garden-lanes{background:linear-gradient(90deg,#7dbb37,#bde465 56%,#8fc948);grid-template-rows:repeat(5,1fr);display:grid;position:absolute;inset:38% 0 0}.lane{border-top:3px solid #ffffff73;position:relative}.plant{z-index:1;position:absolute}.shooter{color:#184c25;background:radial-gradient(circle at 36% 25%,#d9fb7e 0 7%,#8ccf3c 8% 58%,#4c9b34 60%);border:4px solid #377d2c;border-radius:50% 50% 45% 45%;place-items:center;width:54px;height:54px;display:grid;top:50%;left:6%;transform:translateY(-50%);box-shadow:inset -7px -7px #569f33}.shooter i{opacity:0;background:#f7e55c;border-radius:50%;width:27px;height:12px;position:absolute;left:39px}.shooter.awake i{opacity:1;animation:1.3s infinite shoot}.shooter b{letter-spacing:4px;font-size:10px;transform:translate(2px)}.shield{color:#f4e3ba;background:#9d7540;border:4px solid #664321;border-radius:45% 45% 38% 38%;place-items:center;width:50px;height:61px;font-size:25px;display:grid;top:50%;left:18%;transform:translateY(-50%)}.garden-monster{color:#652f35;background:#f08a67;border:4px solid #ad4f51;border-radius:45% 45% 38% 42%;place-items:center;width:56px;height:61px;font-size:19px;font-weight:900;animation:2.3s ease-in-out infinite bob;display:grid;position:absolute;top:50%;right:10%;transform:translateY(-50%)}.lane-2{right:17%}.lane-3{right:12%}.lane-4{right:23%}.lane-5{right:7%}.target-bubble{z-index:3;text-align:center;color:#7b4600;background:radial-gradient(circle at 35% 25%,#fffbd9,#ffd14f 72%);border:5px solid #ffd34e;border-radius:50%;min-width:142px;padding:12px 22px 13px;animation:7s linear infinite fall;position:absolute;top:9%;left:50%;transform:translate(-50%);box-shadow:0 0 0 7px #ffbb2d,0 15px 28px #cb821c59}.target-word{font-size:16px;font-weight:900;display:block}.target-input{font-size:34px;font-weight:900;line-height:1;display:block}.target-input strong{color:#4fa62f}.target-tip{color:#876622;white-space:nowrap;margin-top:8px;font-size:10px;font-weight:900;display:block}.pause-card,.result-card{z-index:5;text-align:center;background:#fff;border-radius:25px;width:290px;padding:24px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 20px 55px #264a6575}.pause-card span,.result-card>span{font-size:38px}.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}.garden-monster{transition:right .45s ease-out;animation:2.3s ease-in-out infinite bob}.coach-card .finger-guide{color:#fff2a5;font-size:11px;font-weight:800;line-height:1.35}.learning-panel{color:#fff;background:linear-gradient(110deg,#102857,#194c8a);align-items:center;gap:22px;min-height:200px;padding:20px 26px;display:flex;box-shadow:inset 0 7px #3871b7}.coach-card{align-items:center;gap:9px;width:240px;display:flex}.coach-flower{font-size:46px}.coach-card strong,.coach-card span{display:block}.coach-card strong{color:#ffeb86;font-size:16px}.coach-card span{color:#d2e8ff;margin-top:5px;font-size:12px}.keyboard-visual{flex:1;min-width:350px}.keyboard-row{justify-content:center;gap:6px;margin:5px 0;display:flex}.keycap{color:#2e4b72;background:#e6f2ff;border:3px solid #84a9dd;border-radius:10px;place-items:center;width:39px;height:39px;font-weight:900;display:grid;box-shadow:0 4px #4172b1}.active-key{color:#fff;background:#4bcbf2;border-color:#d7fcff;transform:translateY(-2px);box-shadow:0 0 0 4px #2c92dd,0 4px #1b5a9e}.stats-grid{grid-template-columns:repeat(5,minmax(65px,1fr));gap:8px;display:grid}.stats-grid>div{text-align:center;background:#102f61;border:1px solid #5281bd;border-radius:13px;min-width:72px;padding:8px 7px}.stats-grid span,.stats-grid small,.stats-grid strong{display:block}.stats-grid span{color:#ffdc53;font-size:19px}.stats-grid small{color:#d1e4ff;margin:2px 0;font-size:11px;font-weight:800}.stats-grid strong{color:#fff2a5;font-size:19px}.stats-grid em{color:#d1e4ff;margin-top:1px;font-size:9px;font-style:normal;display:block}@keyframes float{50%{transform:translateY(-11px)rotate(3deg)}}@keyframes bob{50%{transform:translateY(calc(-50% - 6px))}}@keyframes shoot{0%,25%{opacity:1;transform:translate(0)}65%,to{opacity:0;transform:translate(110px)}}@keyframes fall{0%,15%{top:9%}82%{top:33%}to{top:9%}}@keyframes approach{0%{right:11%}to{right:39%}}@media (width<=1050px){.home-hero{margin:0 18px 38px;padding:56px 36px}.learning-panel{gap:12px;padding:16px}.coach-card{display:none}.stats-grid{grid-template-columns:repeat(5,1fr)}.stats-grid>div{min-width:60px}.keycap{width:34px;height:34px}}@media (width<=760px){.home-hero{grid-template-columns:1fr;min-height:auto}.hero-garden{min-height:320px;margin-top:40px}.course-preview{display:block}.course-preview-actions{justify-items:start;margin-top:20px}.chapter-pills{margin-top:0}.learning-panel{overflow-x:auto}.garden-field{min-height:430px}.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}}.space-key{width:220px}