:root{color-scheme:light;--ink:#45533b;--green:#739756;--paper:#f9faf3;--muted:#9ba68e;font-family:ui-rounded,'PingFang SC','Microsoft YaHei',system-ui,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:#e9eee0;color:var(--ink);overscroll-behavior-y:none}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible,[role=button]:focus-visible{outline:3px solid #5995a7;outline-offset:4px}button:disabled{cursor:default;opacity:.45}button{border:0}body::before{content:'';position:fixed;inset:0;background:radial-gradient(circle at 13% 30%,#ffffff8c 0 5%,transparent 26%),radial-gradient(circle at 85% 80%,#d8e6ca 0,transparent 38%);pointer-events:none}.game{position:relative;max-width:480px;min-height:100svh;margin:auto;padding:22px 27px max(14px,env(safe-area-inset-bottom));background:var(--paper);box-shadow:0 0 80px #59704b10;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px}.icon-button{background:none;width:40px;height:40px;display:grid;place-items:center}.gear{font-size:31px;color:#819c64;text-shadow:0 2px #e0e8d2}.level-pill{background:#edf2df;border:1px solid #e2e9d4;border-radius:20px;display:flex;gap:10px;align-items:center;padding:8px 15px;font-size:14px;font-weight:700}.mini-flower{color:#90ad6d;font-size:20px;line-height:20px}.down{font-size:17px;color:#97a77d}.coins{display:flex;gap:7px;align-items:center;font-size:13px;min-width:57px}.coins>span{display:grid;place-items:center;background:#f8dc6a;color:#b1852a;border:2px solid #e8c451;width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 2px #fff0a4}.scorebar{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;margin-top:25px;min-height:86px}.preview-button{padding:0;background:none;justify-self:start;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;font-weight:800;color:#7d9c5e}.preview{display:grid;width:54px;height:43px;gap:2px;background:#e8eddf;padding:4px;border-radius:6px;box-shadow:inset 0 1px 3px #526b4020}.preview i{background:#cdd5c5;border-radius:1px}.clock{display:flex;gap:8px;align-items:center;justify-content:center;white-space:nowrap;color:#739d4d;font-size:29px;font-weight:800;letter-spacing:-1px;padding-top:3px;font-variant-numeric:tabular-nums}.hourglass{font-size:24px;filter:grayscale(.3)}.clock.urgent{color:#df7271;animation:gentle-pulse 1s infinite}.undo{justify-self:end;color:#91a679;border:1px solid #e2e9d4;border-radius:50%;width:31px;height:31px;font-size:21px;margin-top:5px}.play-area{flex:1;display:flex;flex-direction:column;justify-content:center;padding:6px 0 24px;min-height:270px}.level-heading{display:flex;gap:14px;justify-content:center;align-items:center;color:#96a184;font-size:12px;letter-spacing:2px;margin-bottom:25px}.tiny-dots{color:#c2ceb3;font-weight:900;letter-spacing:3px}.board-wrap{position:relative;width:100%;margin:auto;max-width:330px}.board{display:grid;gap:5px;padding:5px;background:#e4ead8;border-radius:9px;box-shadow:0 7px 0 #d4ddc6,0 10px 20px #6277440e;transition:opacity .2s}.board.tutorial{max-width:235px;margin:auto;gap:3px}.zone{position:relative;display:grid;gap:3px;background:var(--soft);border-radius:5px;padding:4px;aspect-ratio:var(--aspect);border:2px solid color-mix(in srgb,var(--color),white 15%);transition:transform .14s,box-shadow .14s,filter .14s;min-width:0;isolation:isolate}.zone:hover{filter:brightness(1.025)}.zone.selected{transform:translateY(-6px);box-shadow:0 5px 0 #71945240,0 0 0 3px #91ac5a;z-index:2}.zone.selected .gem{animation:float-gem .8s ease-in-out infinite alternate}.zone.empty{cursor:pointer;box-shadow:inset 0 2px 5px #4b6b5620}.zone.target{animation:target-glow 1s ease-in-out infinite alternate}.zone.correct{border-color:var(--color)}.zone.correct::after{content:'✓';position:absolute;right:3px;bottom:2px;background:#fcfff1e8;color:#5f8e4e;border-radius:50%;font-size:11px;line-height:16px;width:16px;height:16px;z-index:3;box-shadow:0 1px 3px #587c4330}.socket{position:relative;display:grid;place-items:center;background:color-mix(in srgb,var(--color),white 30%);border-radius:6px;box-shadow:inset 0 2px 3px #374b4624,inset 0 -1px 1px #ffffff8a;aspect-ratio:1;min-width:0}.socket.empty::after{content:attr(data-symbol);font-size:clamp(6px,2.2vw,11px);opacity:.23;color:color-mix(in srgb,var(--color),black 40%)}.gem{position:absolute;inset:3%;display:grid;place-items:center;background:var(--gem);clip-path:polygon(24% 0,76% 0,100% 24%,100% 76%,76% 100%,24% 100%,0 76%,0 24%);filter:drop-shadow(0 2px 1px #454e4530)}.gem::before{content:'';position:absolute;inset:0;background:conic-gradient(from 45deg at 50% 50%,#0002 0 25%,#0004 0 50%,#fff3 0 75%,#fff6 0);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.gem::after{content:'';position:absolute;inset:18%;background:var(--gem);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);box-shadow:inset 0 1px #fff5;transform:rotate(45deg)}.gem .mark{z-index:1;font-size:clamp(6px,2.3vw,11px);color:#ffffffc7;opacity:0}.accessible-colors .gem .mark{opacity:1}.board-legend{font-size:11px;color:#a1ab94;text-align:center;margin-top:22px;letter-spacing:.7px}.legend-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#a7bd89;margin-right:5px;vertical-align:2px}.rack-section{margin-top:8px}.instruction{text-align:center;font-size:15px;font-weight:650;margin:0 0 14px;min-height:23px;color:#677754;letter-spacing:.3px}.instruction b{color:#de7777}.rack{position:relative;padding:6px;background:#f9f4ed;border:1px solid #d9cec6;border-radius:9px;box-shadow:0 4px 0 #e5dbd2,inset 0 1px #fff;min-height:67px;cursor:pointer;touch-action:manipulation}.rack.waiting{outline:2px dashed #9ab47d;outline-offset:4px}.rack-slots{display:grid;grid-template-columns:repeat(12,1fr);gap:5px}.rack-slot{aspect-ratio:1;min-width:0;border-radius:4px;background:#ece5da;box-shadow:inset 0 2px 3px #a69b8e33,0 1px #fff}.rack-groups{position:absolute;inset:6px;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(0,1fr);gap:5px;pointer-events:none}.rack-piece{display:contents}.rack-gem{position:relative;min-width:0;padding:0;background:none;border-radius:4px;pointer-events:auto}.rack-gem.selected{outline:2px solid #96ab67;outline-offset:2px;z-index:1;animation:float-gem .7s ease-in-out infinite alternate}.rack-footer{display:flex;justify-content:space-between;align-items:center;margin-top:13px;min-height:24px;font-size:10px;color:#b2ad9c;letter-spacing:.6px}.expand{font-size:11px;background:#edf1e2;color:#8b9e72;border:1px solid #e2e9d4;border-radius:13px;padding:4px 10px}.expand span{color:#b1ac83;font-size:9px;margin-left:3px}.tools{display:flex;gap:24px;justify-content:center;margin:34px 0 23px}.tool{position:relative;border:1px solid #b8ce92;border-radius:13px;min-width:80px;height:87px;background:linear-gradient(#e8f3cb,#d9e9b5);box-shadow:0 4px 0 #b3cb8e,inset 0 2px #fff9;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:8px 5px 7px;transition:transform .15s}.tool:active{transform:translateY(3px);box-shadow:0 1px 0 #b3cb8e}.tool-art{font-size:32px;position:absolute;top:-12px;filter:drop-shadow(1px 3px 0 #71914e30);line-height:38px}.wand{transform:rotate(-15deg)}.broom{transform:rotate(8deg)}.magnet{transform:rotate(-12deg)}.tool strong{font-size:12px;letter-spacing:1px}.tool small{font-size:9px;color:#8ba465;margin-top:3px}.tool-count{position:absolute;right:-6px;top:-7px;background:#fffcdf;border:1px solid #ccd3a5;color:#879653;border-radius:50%;width:21px;height:21px;font-size:11px;display:grid;place-items:center;z-index:2}.bottom-note{display:flex;align-items:center;justify-content:center;gap:7px;font-size:10px;color:#b2bba4;letter-spacing:1px}.beta{font-size:8px;padding:2px 4px;border:1px solid #dfe4d6;border-radius:4px;letter-spacing:.5px}.bottom-note button{background:none;font-size:10px;color:#a4b18f;margin-left:10px;padding:0}.toast{position:fixed;z-index:10;left:50%;bottom:23%;transform:translate(-50%,12px);background:#48553ae8;backdrop-filter:blur(6px);color:#fffef4;border-radius:22px;padding:11px 22px;font-size:13px;max-width:85vw;text-align:center;opacity:0;pointer-events:none;transition:.2s;width:max-content}.toast.visible{transform:translate(-50%,0);opacity:1}dialog{border:1px solid #e0e5ce;background:#fafbf3;border-radius:24px;padding:27px 24px;color:var(--ink);max-width:min(370px,calc(100vw - 40px));width:100%;box-shadow:0 20px 80px #30412130}dialog::backdrop{background:#3b4c354a;backdrop-filter:blur(5px)}.modal-icon{font-size:43px;text-align:center;display:block;margin-bottom:12px}.modal-title{text-align:center;font-size:22px;letter-spacing:2px;margin:4px 0 9px}.modal-subtitle{text-align:center;font-size:12px;color:#8b997c;line-height:1.8;margin:0 0 22px}.primary,.secondary{display:block;width:100%;padding:12px;border-radius:13px;font-weight:700;letter-spacing:1px;margin-top:10px}.primary{background:#a8c477;color:#fff;box-shadow:0 3px #8da65e}.secondary{background:#eaf0dc;color:#7e9460}.help-list{display:grid;gap:15px;margin:20px 0;font-size:13px;line-height:1.8;color:#7b886d}.help-row{display:flex;gap:11px;align-items:flex-start}.step{flex-shrink:0;background:#e4edce;color:#8b9e6b;font-size:11px;border-radius:50%;width:22px;height:22px;text-align:center;line-height:22px}.setting-row{display:flex;align-items:center;justify-content:space-between;margin:16px 0;font-size:13px}.switch{padding:6px 13px;border-radius:20px;background:#e6ecd9;color:#9aa788;font-size:12px}.switch.on{background:#b2cb88;color:#fff}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.level-choice{aspect-ratio:1;background:#e6eed7;border:1px solid #d4e1bd;border-radius:12px;font-size:18px;color:#91aa6d}.level-choice.active{background:#a5bf79;color:white}.level-choice.done::after{content:'✓';font-size:9px;display:block}.result-stats{display:flex;justify-content:center;gap:35px;margin:22px 0}.stat{text-align:center}.stat b{display:block;font-size:23px;color:#88a462}.stat small{font-size:11px;color:#a6af98}.reward{text-align:center;font-size:13px;color:#c1a149;margin:16px 0}.sparkles{pointer-events:none;position:absolute;inset:0;overflow:visible}.particle{position:absolute;width:7px;height:7px;background:var(--particle);border-radius:2px;animation:confetti 1s ease-out forwards}.shake{animation:shake .25s}.solved .zone{animation:celebrate .65s ease-in-out both}.solved .zone:nth-child(2n){animation-delay:.1s}@keyframes target-glow{to{box-shadow:0 0 0 3px #9ab5756b}}@keyframes float-gem{to{transform:translateY(-3px)}}@keyframes gentle-pulse{50%{opacity:.65}}@keyframes shake{25%,75%{transform:translateX(-4px)}50%{transform:translateX(4px)}}@keyframes celebrate{50%{transform:translateY(-5px) scale(1.025)}}@keyframes confetti{from{transform:translate(0,0) rotate(0);opacity:1}to{transform:translate(var(--dx),var(--dy)) rotate(270deg);opacity:0}}@media(min-width:600px){.game{margin:22px auto;min-height:min(850px,calc(100svh - 44px));border-radius:28px;border:1px solid #e2e9d5;padding:25px 35px 20px}.play-area{min-height:320px}.tools{margin-top:40px}}@media(max-height:720px){.game{padding-top:12px}.scorebar{margin-top:16px;min-height:70px}.play-area{min-height:235px;padding-bottom:16px}.level-heading{margin-bottom:18px}.tools{margin:27px 0 18px}.tool{height:75px;min-width:75px}.tool-art{font-size:28px;top:-10px}.board-legend{margin-top:18px}.rack-section{margin-top:0}}@media(max-width:360px){.game{padding-left:18px;padding-right:18px}.tools{gap:19px}.clock{font-size:25px}.rack-slots,.rack-groups{gap:3px}.rack{min-height:58px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}