@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap');
:root{--ink:#203c30;--green:#2b654c;--cream:#faf7ed;--yellow:#f8cd57}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Noto Sans SC','Microsoft YaHei',sans-serif}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus-visible,a:focus-visible{outline:3px solid #dd9a2f;outline-offset:3px}header{height:88px;border-bottom:1px solid #e6e5d8;display:flex;align-items:center;gap:35px;max-width:1480px;margin:auto;padding:0 48px}.brand{text-decoration:none;color:var(--ink);font-weight:800;font-size:21px;display:flex;align-items:center;gap:10px}.brand-icon{color:var(--green);font-size:42px}.edition{font-size:13px;color:#748071}#sound{margin-left:auto;border:1px solid #d8ddcf;border-radius:30px;padding:9px 17px;font-size:13px}main{max-width:1384px;padding:0 36px;margin:auto}.intro{display:flex;align-items:center;justify-content:space-between;padding:38px 0 30px}.eyebrow{color:#74816d;font-size:12px;letter-spacing:2px}h1{font-size:42px;letter-spacing:1px;margin:7px 0 10px;font-weight:800}h1 span{color:#397554}h1 i{font-size:29px;color:#e5ad3f;font-style:normal;padding-left:16px}.intro p{font-size:14px;color:#73806f;margin:0}.progress-card{width:190px;border-left:1px solid #dedfce;padding-left:28px}.progress-card strong{font-size:32px;display:block}.progress-card small{font-size:14px;font-weight:500;color:#85917c}.progress-card>span{font-size:12px;color:#84907c}.track{height:6px;background:#e3e5d5;margin-top:12px;border-radius:10px;overflow:hidden}#progress{height:100%;width:0;background:#55825a;transition:width .4s}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 338px;gap:24px;align-items:start}.scene-wrap{background:white;border:1px solid #dee2d1;border-radius:20px;overflow:hidden;box-shadow:0 8px 32px #243e3010}.board-top,.board-bottom{padding:16px 22px;display:flex;align-items:center;justify-content:space-between;font-size:13px}.board-top>span{font-weight:700}.dot{display:inline-block;width:8px;height:8px;background:#e2af46;border-radius:50%;margin-right:9px}.board-top button{background:#f3f4eb;border-radius:20px;padding:8px 13px;font-size:12px}#board{width:100%;aspect-ratio:1000/1400;position:relative;overflow:hidden;isolation:isolate;background:#0d8966}.land{position:absolute;width:100%;height:100%;inset:0}.board-caption{position:absolute;bottom:1.2%;left:0;width:100%;text-align:center;color:#fff9;font-size:10px;letter-spacing:3px;pointer-events:none}.target,.scene-piece{position:absolute;user-select:none;-webkit-user-drag:none}.target{border:1.5px dashed #e8f6d36e;border-radius:30%;background:#f4f8d20a;cursor:pointer;transition:background .2s}.target::after{content:attr(data-n);position:absolute;top:40%;width:100%;text-align:center;font-size:clamp(9px,1vw,13px);color:#e7f2cd85}.target.correct{opacity:0;pointer-events:none}.target.highlight{background:#ffe27f55;border:3px dashed #ffdb6b;animation:pulse 1s infinite}.no-outlines .target{opacity:0}.no-outlines .target.highlight{opacity:1}.scene-piece{object-fit:contain;pointer-events:none;filter:drop-shadow(0 2px 1px #183e2520)}#ghosts{position:absolute;inset:0;background:#0d89661a;z-index:3;pointer-events:none}#ghosts .scene-piece{opacity:.94}#ghosts[hidden]{display:none}.board-bottom{font-size:11px;color:#788574;padding:13px 18px;gap:8px}.board-bottom button{white-space:nowrap;color:#366744;font-size:12px;font-weight:600}aside{background:#efefdf;border-radius:20px;padding:24px 18px 14px;position:sticky;top:18px}.tray-heading{display:flex;align-items:center;justify-content:space-between}.tray-heading h2{font-size:23px;margin:5px 0 0}.tray-heading>span{background:#e1e5d2;border-radius:14px;padding:5px 10px;font-size:11px;color:#718268}.filters{display:flex;gap:4px;margin-top:22px;border-bottom:1px solid #d9decb;padding-bottom:13px}.filters button{font-size:12px;padding:7px 14px;border-radius:20px}.filters .active{background:var(--green);color:white}.tray-tip{font-size:11px;line-height:1.8;color:#7a876e;min-height:38px;margin:13px 0}#tray{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;max-height:760px;overflow:auto;padding:2px 4px 8px 2px;scrollbar-width:thin;scrollbar-color:#bfcab0 transparent}.asset{border:1px solid #dde1cb;background:#faf9f0;border-radius:13px;min-height:133px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px;touch-action:none;transition:border .15s,transform .15s;position:relative}.asset:hover{border-color:#8aaa76;transform:translateY(-2px)}.asset.selected{border:2px solid #bc8b29;background:#fff5cb;padding:7px}.asset img{width:100%;height:95px;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}.asset span{font-size:11px;margin-top:5px;color:#6b7a60}.asset small{position:absolute;left:7px;top:6px;font-size:9px;color:#99a28c}.tray-footer{border-top:1px solid #d9decb;margin-top:13px;padding-top:15px;display:flex;justify-content:space-between;font-size:11px;color:#728267;align-items:center}.tray-footer label{display:flex;align-items:center;gap:3px}.tray-footer input{accent-color:#427252}footer{display:flex;justify-content:space-between;font-size:10px;color:#929985;padding:20px 0 30px}#toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,15px);padding:13px 25px;background:#254c37;color:white;border-radius:30px;font-size:14px;opacity:0;transition:.2s;pointer-events:none;z-index:100}#toast.show{opacity:1;transform:translate(-50%,0)}.dragging{position:fixed;pointer-events:none;z-index:200;filter:drop-shadow(0 12px 10px #17362455);object-fit:contain;user-select:none}#win{position:fixed;inset:0;z-index:90;background:#183d30aa;backdrop-filter:blur(6px);display:grid;place-items:center}#win[hidden]{display:none}.win-card{background:#faf7ed;border-radius:28px;padding:44px;text-align:center;max-width:90vw}.win-flower{font-size:80px;color:#d6a340}.win-card h2{font-size:29px}.win-card p{font-size:14px;color:#788471}.win-card button{background:#356347;border-radius:25px;color:white;padding:12px 24px;margin:16px 5px 0;font-size:13px}.win-card #admire{background:#e8e9d9;color:#356347}@keyframes pulse{50%{background:#ffe27f88}}@media(max-width:900px){header{padding:0 22px;height:72px}.edition{display:none}main{padding:0 20px}.intro{padding:26px 0}h1{font-size:31px}.progress-card{width:135px;padding-left:16px}.intro p{max-width:270px;line-height:1.8;font-size:12px}.play-layout{grid-template-columns:minmax(0,1fr) 260px;gap:14px}aside{padding:18px 12px}.filters button{padding:6px 10px}.asset{min-height:108px}.asset img{height:75px}#tray{max-height:580px}.board-bottom>span{max-width:190px}}@media(max-width:640px){main{padding:0 12px}.brand{font-size:18px}.intro{gap:10px}h1{font-size:27px}h1 i{display:none}.progress-card{width:100px;flex-shrink:0}.progress-card strong{font-size:25px}.progress-card small{font-size:11px}.eyebrow{font-size:10px;letter-spacing:1px}.play-layout{display:flex;flex-direction:column}.scene-wrap{width:100%;border-radius:15px}.board-top{padding:11px 15px}aside{position:static;width:100%;padding:17px}#tray{grid-template-columns:repeat(3,1fr);max-height:350px}.asset img{height:80px}.tray-heading h2{font-size:20px}.filters{margin-top:12px}.tray-tip{min-height:0}footer{font-size:9px;gap:14px}.board-bottom{font-size:10px}.target::after{font-size:9px}#toast{width:max-content;max-width:90%;font-size:12px;text-align:center}}
.save-button{margin-left:auto!important;border-radius:30px;background:#2b654c;color:white;padding:11px 21px;font-size:13px;white-space:nowrap}.save-button:disabled{opacity:.6}.free-tag{font-size:11px;color:#7a886d;background:#f1f3e6;padding:7px 12px;border-radius:20px}.edit-tools{padding:9px 16px;background:#f4f5eb;display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid #eceee2}.edit-tools>span{font-size:11px;color:#7a886d}.edit-tools>div{display:flex;gap:5px;flex-shrink:0}.edit-tools button{background:white;border:1px solid #dce2ce;border-radius:7px;min-width:31px;height:29px;font-size:17px}.edit-tools #remove{font-size:11px;padding:0 8px}.edit-tools button:disabled{opacity:.35;cursor:default}#landscape{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#landscape[hidden]{display:none}#placed{position:absolute;inset:0}#placed .scene-piece{pointer-events:auto;touch-action:none;cursor:grab}#placed .scene-piece:active{cursor:grabbing}.selected-piece{outline:2px dashed #ffe495;outline-offset:3px;border-radius:7px}#empty-canvas{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#e2f3cf88;pointer-events:none;text-align:center}#empty-canvas[hidden]{display:none}#empty-canvas>span{font-size:65px}#empty-canvas p{font-size:17px;margin:12px 0}#empty-canvas small{font-size:11px;letter-spacing:1px}.background-picker{margin-top:17px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#6d7c62}.background-picker select{font:inherit;color:#42613d;background:#faf9f0;border:1px solid #d9dfc8;border-radius:10px;padding:7px 10px}.empty-tray{grid-column:1/-1;text-align:center;color:#7a886d;font-size:12px;line-height:2;padding:28px 0}.asset{min-height:133px}.board-top>span:last-child{font-weight:400}@media(max-width:640px){header{padding:0 15px;gap:8px}.save-button{padding:10px 13px;font-size:11px}.brand{font-size:16px}.brand-icon{font-size:33px}.intro p{max-width:250px}.free-tag{font-size:9px;padding:6px 9px}.edit-tools{padding:8px 10px}.edit-tools>span{font-size:9px;max-width:130px;line-height:1.7}.edit-tools button{min-width:28px;height:28px}.asset{min-height:110px}.board-bottom>span{max-width:230px}.background-picker{margin-top:12px}#empty-canvas p{font-size:14px}}
.save-state{font-size:11px;color:#8d9a87;white-space:nowrap;margin-left:12px}.save-state[data-state="saving"]{color:#a08e56}.save-state[data-state="error"]{color:#b0603a}.user-chip{margin-left:10px;display:flex;align-items:center;gap:6px;border:1px solid #d8ddcf;border-radius:30px;padding:7px 12px;background:#fff;font-size:12px;max-width:172px}.user-chip[hidden]{display:none}.user-dot{width:21px;height:21px;border-radius:50%;background:#e9efdd;color:#3d6b4e;display:grid;place-items:center;font-size:11px;flex-shrink:0}#user-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-chip small{color:#93a08c;font-size:10px;flex-shrink:0}.login-layer{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:24px;background:#183d30d9;backdrop-filter:blur(8px)}.login-layer[hidden]{display:none}.login-card{width:min(420px,100%);max-height:92vh;overflow:auto;background:#faf7ed;border:1px solid #e6e5d8;border-radius:26px;padding:36px 34px 26px;text-align:center;box-shadow:0 24px 70px #0d241b66}.login-flower{font-size:50px;line-height:1;color:#397554}.login-card .eyebrow{margin:8px 0 0}.login-card h2{font-size:26px;margin:6px 0 8px;letter-spacing:1px}.login-sub{font-size:13px;line-height:1.8;color:#788471;margin:0 0 20px}.login-sub:empty{display:none}#login-form{text-align:left}#login-name{width:100%;font:inherit;font-size:22px;font-weight:600;letter-spacing:2px;text-align:center;color:#22402f;background:#fffdf6;border:2px solid #d9dfc8;border-radius:14px;padding:13px 12px;outline:none;transition:border .15s,box-shadow .15s}#login-name:focus{border-color:#6d9a76;box-shadow:0 0 0 4px #cfe0c466}#login-name::placeholder{color:#b7bfaa;font-weight:400;letter-spacing:1px;font-size:16px}.login-hint{font-size:11px;color:#95a08b;margin:9px 2px 0}.login-error{font-size:12px;line-height:1.5;color:#b4532f;min-height:18px;margin:6px 2px 0}.login-button{width:100%;margin-top:6px;background:#2b654c;color:#fff;border-radius:14px;padding:14px;font-size:15px;font-weight:600;letter-spacing:2px;transition:background .15s,opacity .15s}.login-button:hover{background:#357a5c}.login-button:disabled{opacity:.6;cursor:default}.login-cancel{display:block;margin:14px auto 0;font-size:12px;color:#5d7d64;text-decoration:underline;text-underline-offset:3px}.login-cancel[hidden]{display:none}.login-note{font-size:11px;line-height:1.7;color:#93a08b;margin:18px 0 0}@media(max-width:640px){.save-state{display:none}.user-chip{padding:6px 9px;max-width:104px;margin-left:7px}.user-chip small{display:none}.login-card{padding:28px 20px 22px;border-radius:22px}.login-card h2{font-size:23px}.login-flower{font-size:42px}#login-name{font-size:20px}.login-sub{font-size:12px;margin-bottom:16px}}