:root{--c-primary: #d39b0d;--c-accent: #29e0ac;--c-cta: #1206f9;--c-bg: #fbfbf8;--c-surface: #ffffff;--c-text: #2c271b;--c-text-2: #7a725c;--c-border: #e6e3db;--t-gold: #f6e9c4;--t-gold-2: #fdf6e2;--t-mint: #d4f8ec;--t-mint-2: #ecfbf5;--t-blue: #e2e0ff;--t-blue-2: #efeeff;--t-gold-deep: #b9860a;--t-mint-deep: #0fb584;--t-blue-deep: #3d35c4;--r-lg: 20px;--r-md: 14px;--r-sm: 10px;--font-head: "Quicksand", "PingFang SC", system-ui, sans-serif;--font-body: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;--shadow-soft: 0 10px 26px rgba(124, 106, 50, .1);--shadow-pop: 0 16px 40px rgba(18, 6, 249, .18);--shadow-btn: 0 6px 0 rgba(0, 0, 0, .12)}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-body);color:var(--c-text);background-color:var(--c-bg);line-height:1.65;min-height:100vh;background-image:radial-gradient(rgba(211,155,13,.1) 2px,transparent 2.6px),radial-gradient(rgba(41,224,172,.1) 2px,transparent 2.6px);background-size:34px 34px,34px 34px;background-position:0 0,17px 17px}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}button:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px;border-radius:8px}button:disabled{cursor:not-allowed;opacity:.55}.app{max-width:1200px;margin:0 auto;padding:0 20px 60px}h1,h2,h3{font-family:var(--font-head);line-height:1.25}.page{animation:pageIn .45s ease both}@keyframes pageIn{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-head);font-weight:700;font-size:16px;padding:12px 22px;border-radius:var(--r-lg);transition:transform .15s ease,box-shadow .15s ease,background .15s ease;will-change:transform}.btn:active{transform:translateY(3px) scale(.98)}.btn-cta{background:var(--c-cta);color:#fff;box-shadow:var(--shadow-btn)}.btn-cta:hover{background:var(--t-blue-deep);transform:translateY(-2px);box-shadow:0 9px #0000001f}.btn-ghost{background:var(--c-surface);color:var(--c-text);border:2px solid var(--c-border)}.btn-ghost:hover{border-color:var(--c-primary);color:var(--t-gold-deep);transform:translateY(-2px)}.btn-ghost-sm{font-size:14px;padding:7px 14px;border-radius:var(--r-md);background:var(--c-surface);border:2px solid var(--c-border)}.btn-ghost-sm:hover{border-color:var(--c-accent);color:var(--t-mint-deep)}.btn-run{background:var(--c-primary);color:#fff;font-size:18px;padding:12px 34px;box-shadow:var(--shadow-btn);letter-spacing:2px}.btn-run:hover{transform:translateY(-2px);box-shadow:0 9px #00000024;background:var(--t-gold-deep)}.btn-run.stop{background:var(--c-cta)}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 0 8px;margin-bottom:8px}.logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-head);font-weight:700;font-size:20px;color:var(--c-text)}.logo-mark{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;font-size:24px;background:linear-gradient(135deg,var(--t-gold),var(--t-mint));border-radius:50%;box-shadow:var(--shadow-soft);animation:floaty 3.2s ease-in-out infinite}.nav-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.nav-links>button{font-size:15px;font-weight:600;color:var(--c-text-2);padding:9px 16px;border-radius:var(--r-lg);transition:background .15s ease,color .15s ease,transform .15s ease}.nav-links>button:hover{background:var(--t-gold);color:var(--t-gold-deep);transform:translateY(-2px)}.nav-links>button.on{background:var(--c-primary);color:#fff}.nav-star{display:inline-flex;align-items:center;gap:6px;background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:6px 14px;font-size:15px}.nav-star b{color:var(--t-gold-deep);font-family:var(--font-head)}.icon-btn{font-size:20px;padding:8px;border-radius:50%;background:var(--c-surface);border:2px solid var(--c-border);transition:transform .15s ease}.icon-btn:hover{transform:scale(1.1) rotate(-10deg)}.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;padding:46px 30px;border-radius:32px;background:linear-gradient(135deg,var(--t-gold-2) 0%,var(--t-mint-2) 55%,var(--t-blue-2) 100%);border:2px solid var(--c-border);box-shadow:var(--shadow-soft);position:relative;overflow:hidden}.hero:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(var(--c-surface) 3px,transparent 3.4px);background-size:30px 30px;opacity:.55;pointer-events:none}.hero-text{position:relative;z-index:1}.hero-text h1{font-size:clamp(30px,4.6vw,48px);margin:16px 0 14px;color:var(--c-text)}.hero-text p{color:var(--c-text-2);font-size:16px;margin-bottom:24px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-art{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:240px}.mascot-bubble{width:170px;height:170px;display:flex;align-items:center;justify-content:center;font-size:96px;background:var(--c-surface);border-radius:50%;box-shadow:0 18px 40px #1206f924;border:6px solid #fff;animation:floaty 3.4s ease-in-out infinite}.bubble-text{margin-top:16px;background:var(--c-surface);border-radius:var(--r-lg);padding:8px 18px;font-size:15px;font-weight:600;box-shadow:var(--shadow-soft);animation:popIn .5s ease both .3s}.dot-deco{position:absolute;border-radius:50%;animation:sparkle 2.4s ease-in-out infinite}.dot-deco.d1{width:26px;height:26px;background:var(--c-primary);top:8%;right:12%}.dot-deco.d2{width:16px;height:16px;background:var(--c-accent);bottom:16%;left:8%;animation-delay:.5s}.dot-deco.d3{width:12px;height:12px;background:var(--c-cta);top:22%;left:14%;animation-delay:1s}.milestones{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:26px 0 8px}.ms-card{background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:18px 16px;text-align:center;box-shadow:var(--shadow-soft);transition:transform .18s ease}.ms-card:hover{transform:translateY(-5px) rotate(-1deg)}.ms-card span{font-size:30px;display:block;margin-bottom:6px}.ms-card b{font-family:var(--font-head);font-size:17px;color:var(--c-text)}.ms-card p{font-size:13px;color:var(--c-text-2);margin-top:2px}.ms-card.c1{background:var(--t-gold-2)}.ms-card.c2{background:var(--t-mint-2)}.ms-card.c3{background:var(--t-blue-2)}.ms-card.c4{background:var(--t-gold)}.levels{margin-top:34px}.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px}.sec-head h2{font-size:26px}.sec-sub{color:var(--c-text-2);font-size:14px}.level-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:18px}.level-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:22px 14px 18px;border-radius:var(--r-lg);border:2px solid var(--c-border);background:var(--c-surface);box-shadow:var(--shadow-soft);transition:transform .18s ease,box-shadow .18s ease;overflow:hidden}.level-card:not(:disabled):hover{transform:translateY(-6px) rotate(1deg);box-shadow:var(--shadow-pop)}.level-card.theme-gold{background:linear-gradient(160deg,var(--t-gold-2),var(--c-surface))}.level-card.theme-mint{background:linear-gradient(160deg,var(--t-mint-2),var(--c-surface))}.level-card.theme-blue{background:linear-gradient(160deg,var(--t-blue-2),var(--c-surface))}.level-card.theme-rainbow{background:linear-gradient(160deg,var(--t-gold-2),var(--t-mint-2),var(--t-blue-2))}.lv-num{align-self:flex-start;font-size:12px;font-weight:700;color:var(--t-gold-deep);background:var(--t-gold);padding:3px 10px;border-radius:999px}.theme-mint .lv-num,.theme-blue .lv-num,.theme-rainbow .lv-num{color:var(--t-blue-deep);background:var(--t-blue)}.lv-mascot{font-size:52px;line-height:1.1;animation:floaty 3s ease-in-out infinite}.lv-title{font-family:var(--font-head);font-weight:700;font-size:17px}.lv-concept{font-size:12px;color:var(--c-text-2);background:var(--c-surface);padding:2px 10px;border-radius:999px;border:1px solid var(--c-border)}.lv-stars{display:flex;gap:3px;font-size:18px;margin-top:4px}.lv-stars i{color:var(--c-border);font-style:normal}.lv-stars i.on{color:var(--c-primary);animation:starPop .4s ease both}.level-card.locked{filter:saturate(.2);opacity:.7;background:var(--c-surface)}.level-card.locked .lv-mascot{animation:none}.site-foot{text-align:center;color:var(--c-text-2);font-size:13px;padding:34px 0 6px}.guide-hero{text-align:center;padding:40px 24px 26px;border-radius:var(--r-lg);background:linear-gradient(135deg,var(--t-mint-2),var(--t-blue-2));border:2px solid var(--c-border);margin-bottom:28px}.guide-hero h1{font-size:32px;margin-bottom:8px}.guide-hero p{color:var(--c-text-2)}.guide-sec{margin-bottom:30px}.guide-sec h2{font-size:22px;margin-bottom:12px}.guide-sec .lead{color:var(--c-text-2);margin-bottom:16px}.guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}.g-card{background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:18px;box-shadow:var(--shadow-soft);transition:transform .18s ease}.g-card:hover{transform:translateY(-4px)}.g-card span{font-size:28px}.g-card b{display:block;font-family:var(--font-head);font-size:16px;margin:6px 0 2px}.g-card p{font-size:13px;color:var(--c-text-2)}.guide-list{display:grid;gap:12px}.g-row{display:flex;gap:14px;align-items:baseline;background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:16px 20px;box-shadow:var(--shadow-soft)}.g-row b{font-family:var(--font-head);font-size:17px;color:var(--t-blue-deep);white-space:nowrap}.g-row p{color:var(--c-text-2);font-size:15px}.guide-tips{list-style:none;display:grid;gap:10px}.guide-tips li{background:var(--c-surface);border:2px solid var(--c-border);border-left:6px solid var(--c-primary);border-radius:var(--r-md);padding:12px 18px;font-size:15px;box-shadow:var(--shadow-soft)}.guide-faq{display:grid;gap:12px}.guide-faq details{background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:16px 20px;box-shadow:var(--shadow-soft)}.guide-faq summary{font-family:var(--font-head);font-weight:700;font-size:16px;cursor:pointer}.guide-faq p{color:var(--c-text-2);margin-top:8px;font-size:15px}.game-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:10px 0 16px}.game-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1}.game-title h1{font-size:24px}.game-top-right{margin-left:auto}.chip{font-size:13px;font-weight:700;padding:4px 14px;border-radius:999px;display:inline-flex;align-items:center}.chip-gold{background:var(--c-primary);color:#fff}.chip-soft{background:var(--t-mint);color:var(--t-mint-deep)}.chip-best{background:var(--t-gold);color:var(--t-gold-deep)}.chip-opt{background:var(--t-blue);color:var(--t-blue-deep)}.game-layout{display:grid;grid-template-columns:250px 1fr;gap:20px;align-items:start}.palette{background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:16px;box-shadow:var(--shadow-soft);position:sticky;top:16px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.panel-head h3{font-size:17px}.mini-hint{font-size:12px;color:var(--c-text-2)}.palette-list{display:grid;gap:10px}.palette-block{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--r-md);color:#fff;font-family:var(--font-head);font-weight:700;font-size:15px;cursor:grab;box-shadow:var(--shadow-btn);-webkit-user-select:none;user-select:none;transition:transform .15s ease,box-shadow .15s ease}.palette-block:hover{transform:translate(4px) scale(1.03)}.palette-block:active{cursor:grabbing;transform:scale(.96)}.palette-block .pb-icon{font-size:20px}.block-forward{background:var(--c-primary)}.block-left{background:var(--c-accent);color:var(--c-text)}.block-right{background:var(--c-cta)}.block-repeat{background:linear-gradient(135deg,var(--c-primary),var(--c-accent))}.block-ifBlocked{background:linear-gradient(135deg,var(--c-cta),var(--c-accent))}.target-note{margin-top:12px;font-size:12px;color:var(--t-blue-deep);background:var(--t-blue-2);border-radius:var(--r-sm);padding:7px 10px}.tip-box{margin-top:14px;background:var(--t-gold-2);border:2px dashed var(--c-primary);border-radius:var(--r-md);padding:12px 14px}.tip-box b{color:var(--t-gold-deep);font-family:var(--font-head)}.tip-box p{font-size:13px;color:var(--c-text-2);margin-top:4px}.stage{display:grid;gap:16px;min-width:0}.board-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.status{font-size:14px;color:var(--c-text-2);background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:10px 16px;min-height:46px;display:inline-flex;align-items:center;flex:1;min-width:200px}.status.fail{color:var(--t-blue-deep);background:var(--t-blue-2);border-color:var(--t-blue);font-weight:600}.status.running{color:var(--t-gold-deep);background:var(--t-gold-2);border-color:var(--c-primary);font-weight:600}.board-wrap{display:grid;gap:10px;justify-items:center}.board{position:relative;width:100%;max-width:min(64vh,560px);aspect-ratio:1;border-radius:var(--r-lg);border:3px solid #fff;box-shadow:var(--shadow-soft);overflow:hidden}.grid{display:grid;grid-template-columns:repeat(var(--n),1fr);grid-template-rows:repeat(var(--n),1fr);position:absolute;top:0;right:0;bottom:0;left:0}.cell{display:flex;align-items:center;justify-content:center;position:relative;border:1px solid rgba(255,255,255,.75)}.board.theme-gold .grid{background:var(--t-gold-2)}.board.theme-gold .cell.alt{background:var(--t-gold)}.board.theme-mint .grid{background:var(--t-mint-2)}.board.theme-mint .cell.alt{background:var(--t-mint)}.board.theme-blue .grid{background:var(--t-blue-2)}.board.theme-blue .cell.alt{background:var(--t-blue)}.board.theme-rainbow .grid{background:linear-gradient(135deg,var(--t-gold-2),var(--t-mint-2),var(--t-blue-2))}.board.theme-rainbow .cell.alt{background:#ffffff8c}.cell.goal{background:#ffffffe6!important;animation:pulseGoal 1.6s ease-in-out infinite}.cell-goal{font-size:clamp(18px,5vw,40px);animation:sparkle 1.8s ease-in-out infinite}.cell-rock{font-size:clamp(14px,4vw,32px)}.animal{position:absolute;top:0;left:0;width:calc(100% / var(--n));height:calc(100% / var(--n));display:flex;align-items:center;justify-content:center;transition:transform .45s cubic-bezier(.34,1.56,.64,1);z-index:2;pointer-events:none}.mascot-emoji{font-size:clamp(22px,6vw,46px);filter:drop-shadow(0 4px 6px rgba(0,0,0,.18));line-height:1}.mascot-emoji.bump-anim{animation:bumpAnim .4s ease}.mascot-emoji.win-anim{animation:winJump .9s ease infinite}.dir-arrow{position:absolute;bottom:2px;right:4px;font-size:clamp(9px,2.4vw,16px);color:var(--c-cta);text-shadow:0 1px 0 #fff,0 -1px 0 #fff,1px 0 0 #fff,-1px 0 0 #fff;transition:transform .3s ease}.board-legend{display:flex;gap:18px;font-size:13px;color:var(--c-text-2);background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:8px 16px}.program-panel{background:var(--c-surface);border:2px solid var(--c-border);border-radius:var(--r-lg);padding:16px;box-shadow:var(--shadow-soft)}.program{min-height:96px;display:flex;flex-direction:column;gap:10px;padding:14px;border-radius:var(--r-md);border:2px dashed var(--c-border);background:var(--c-bg);transition:border-color .15s ease,background .15s ease}.program.targeting,.slot.targeting{border-color:var(--c-cta);background:var(--t-blue-2)}.empty-hint{color:var(--c-text-2);font-size:14px;text-align:center;padding:24px 10px}.prog-block{border-radius:var(--r-md);background:var(--c-primary);color:#fff;box-shadow:var(--shadow-btn);overflow:hidden}.prog-block.block-left{background:var(--c-accent);color:var(--c-text)}.prog-block.block-right{background:var(--c-cta)}.prog-block.block-repeat{background:linear-gradient(135deg,var(--c-primary),var(--c-accent))}.prog-block.block-ifBlocked{background:linear-gradient(135deg,var(--c-cta),var(--c-accent))}.prog-block.running{animation:wiggle .5s ease infinite;outline:3px solid var(--c-cta);outline-offset:2px}.prog-block.branch-on{outline:3px solid var(--c-accent);outline-offset:2px}.pb-head{display:flex;align-items:center;gap:8px;padding:10px 12px;font-family:var(--font-head);font-weight:700;font-size:14px;cursor:pointer}.pb-icon{font-size:17px}.pb-label{flex:1}.n-stepper{display:inline-flex;align-items:center;gap:6px;background:#ffffff40;border-radius:999px;padding:2px 8px}.n-stepper button{width:22px;height:22px;border-radius:50%;background:#fff;color:var(--c-text);font-weight:800;line-height:1}.n-stepper b{font-size:14px;min-width:14px;text-align:center}.pb-del{width:24px;height:24px;border-radius:50%;background:#ffffff47;color:inherit;font-size:12px;line-height:1;transition:background .15s ease,transform .15s ease}.pb-del:hover{background:#fff9;transform:scale(1.12)}.slot{display:flex;flex-direction:column;gap:8px;margin:0 10px 10px;padding:10px;min-height:40px;border-radius:var(--r-sm);border:2px dashed rgba(255,255,255,.6);background:#ffffff2e;cursor:pointer}.block-left .slot,.block-repeat .slot{border-color:#2c271b4d;background:#ffffff59}.slot-hint{font-size:12px;opacity:.9;text-align:center}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#2c271b73;z-index:50;padding:20px;animation:fadeIn .3s ease both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.confetti{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:51}.confetti-piece{position:absolute;top:-24px;width:10px;height:16px;border-radius:3px;animation:confettiFall 1.6s ease-in forwards}@keyframes confettiFall{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(var(--dx),var(--dy)) rotate(var(--rot));opacity:0}}.win-card{position:relative;z-index:52;background:var(--c-surface);border:4px solid var(--c-primary);border-radius:28px;padding:30px 34px;max-width:420px;width:100%;text-align:center;box-shadow:var(--shadow-pop);animation:popIn .45s cubic-bezier(.34,1.56,.64,1) both}.win-emojis{display:flex;justify-content:center;gap:14px;font-size:52px;margin-bottom:8px}.win-mascot{animation:winJump .9s ease infinite}.win-card h2{font-size:30px;color:var(--c-primary);margin-bottom:10px}.win-stars{display:flex;justify-content:center;gap:10px;font-size:40px;margin-bottom:12px}.win-stars i{color:var(--c-border);font-style:normal;animation:starPop .5s ease both}.win-stars i:nth-child(2){animation-delay:.12s}.win-stars i:nth-child(3){animation-delay:.24s}.win-stars i.on{color:var(--c-primary);text-shadow:0 0 12px rgba(211,155,13,.5)}.win-msg{color:var(--c-text-2);font-size:15px;margin-bottom:20px}.win-msg b{color:var(--c-cta);font-family:var(--font-head)}.win-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}@keyframes floaty{0%,to{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(2deg)}}@keyframes popIn{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.06)}to{transform:scale(1);opacity:1}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}@keyframes sparkle{0%,to{opacity:.35;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}@keyframes pulseGoal{0%,to{box-shadow:inset 0 0 #d39b0d59}50%{box-shadow:inset 0 0 0 6px #d39b0d00}}@keyframes bumpAnim{0%,to{transform:translate(0)}25%{transform:translate(-5px,-8px)}50%{transform:translate(5px,-8px)}75%{transform:translate(0)}}@keyframes winJump{0%,to{transform:translateY(0) scale(1)}30%{transform:translateY(-16px) scale(1.15) rotate(-6deg)}60%{transform:translateY(0) scale(.94)}}@keyframes starPop{0%{transform:scale(0) rotate(-30deg);opacity:0}60%{transform:scale(1.3) rotate(8deg)}to{transform:scale(1) rotate(0);opacity:1}}.desktop-only{display:inline}@media (max-width: 900px){.hero{grid-template-columns:1fr;padding:30px 22px}.hero-art{min-height:200px}.mascot-bubble{width:140px;height:140px;font-size:78px}.game-layout{grid-template-columns:1fr}.palette{position:static}.palette-list{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px}.palette-block{min-width:140px}.palette .tip-box{display:none}.board{max-width:100%}.game-top-right{margin-left:0}}@media (max-width: 560px){.app{padding:0 14px 40px}.milestones{grid-template-columns:repeat(2,1fr)}.hero-text h1{font-size:28px}.level-grid{grid-template-columns:repeat(2,1fr)}.level-card{padding:16px 10px 14px}.lv-mascot{font-size:42px}.win-card{padding:24px 20px}.desktop-only{display:none}.board-tools .btn{flex:1}}