:root{font-family:"Arial Rounded MT Bold","Microsoft YaHei",system-ui,sans-serif;color:#29365e}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{min-height:100%;margin:0}body{background:radial-gradient(circle at 10% 10%,#fff 0 5%,transparent 5.5%),linear-gradient(155deg,#def8ff,#eef2ff 55%,#fff2d9)}button,a{font:inherit;touch-action:manipulation}button{border:0;cursor:pointer}button:focus-visible,a:focus-visible{outline:4px solid #ffbd37;outline-offset:3px}.app{width:min(900px,100%);min-height:100dvh;margin:auto}.screen{position:relative;min-height:100dvh;padding:max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.selection{display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center}.lobby{position:absolute;top:18px;left:16px;padding:11px 16px;border-radius:99px;color:#5a68a0;background:#fffffff0;box-shadow:0 8px 18px #43549124;font-weight:800;text-decoration:none}.hero{position:relative;width:170px;height:115px;margin-top:34px}.hero i{position:absolute;bottom:35px;width:52px;height:20px;border-radius:7px;background:#e58b46;box-shadow:inset 0 -5px #ad5a31}.hero i:nth-of-type(1){left:8px}.hero i:nth-of-type(2){left:59px}.hero i:nth-of-type(3){left:110px}.hero b{position:absolute;right:0;bottom:0;left:0;color:#42a9e8;font-size:26px;letter-spacing:8px}.hero .animal{position:absolute;top:4px;left:8px;font-size:38px}.eyebrow{margin:8px 0 0;color:#6e80ad;font-size:13px;font-weight:800;letter-spacing:.08em}h1{margin:2px 0;color:#3f62bd;font-size:clamp(34px,8vw,48px);text-shadow:0 3px #fff}.tagline{max-width:520px;margin:8px 0 18px;color:#7180a4;font-size:17px}.difficulty{width:min(650px,100%);padding:16px 18px 18px;border-radius:24px;background:#ffffffe8;box-shadow:0 12px 28px #45549721}.difficulty h2{margin:0 0 10px;font-size:17px}.difficulty-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.difficulty-button{display:flex;min-height:76px;align-items:center;flex-direction:column;justify-content:center;border:3px solid transparent;border-radius:18px;color:#334477;background:#f1f4fc}.difficulty-button small{margin-top:5px;color:#7180a4}.difficulty-button.selected{border-color:#5e8ee7;background:#e7f1ff}.start-actions{display:flex;margin-top:18px;align-items:center;gap:12px}.primary,.test-button{min-width:220px;min-height:54px;padding:10px 26px;border-radius:99px;color:#fff;background:linear-gradient(#69a8f4,#4d7fdd);box-shadow:0 7px #355cab;font-size:20px;font-weight:900}.round{display:grid;width:52px;height:52px;padding:0;place-items:center;border-radius:50%;color:#29365e;background:#fffffff0;box-shadow:0 8px 18px #43549124;font-size:24px}.game{display:flex;flex-direction:column}.game header{display:grid;align-items:center;grid-template-columns:52px 1fr 52px;gap:12px}.stats,.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stats div,.result-grid div{padding:8px;border-radius:15px;text-align:center;background:#f3f6ff}.stats span,.result-grid span{display:block;color:#7180a4;font-size:12px}.stats strong,.result-grid strong{font-size:20px}.status{display:flex;min-height:42px;margin:8px 0;align-items:center;justify-content:center;gap:10px}.status b{padding:6px 13px;border-radius:99px;color:#fff;background:#5c88df;font-size:13px}.status span{color:#6877a1;font-weight:700}.play-panel{display:flex;flex:1;padding:16px;align-items:center;flex-direction:column;border-radius:28px;background:#ffffffdc;box-shadow:0 18px 42px #3a4c8f29}.scene-wrap{width:min(100%,720px);overflow:auto}.scene{position:relative;min-width:520px;padding-top:28px}.board{--cols:7;--rows:6;position:relative;display:grid;width:100%;aspect-ratio:var(--cols)/var(--rows);grid-template-columns:repeat(var(--cols),1fr);grid-template-rows:repeat(var(--rows),1fr);overflow:hidden;border:5px solid #5571a9;border-radius:22px;background:linear-gradient(to bottom,#dff6ff 0 43%,#65c8ed 43% 100%);touch-action:none;user-select:none}.cell{position:relative;border:1px dashed #ffffff50}.cell.bank{background:linear-gradient(#78ca65,#50a153);border-color:#3d8d4d}.cell.water{background:linear-gradient(#70d1f2,#3aa9df)}.cell.foundation::after{position:absolute;right:16%;bottom:8%;left:16%;height:24%;border-radius:50%;background:#7f8ba2;box-shadow:inset 0 -3px #59677e;content:""}.cell.outline{background:#ffd46930;box-shadow:inset 0 0 0 2px #ffd46999}.cell.hint{box-shadow:inset 0 0 0 5px #ffca3a;background:#fff1a855}.piece{position:absolute;z-index:3;display:grid;place-items:center;border:3px solid #9a512d;border-radius:10px;background:linear-gradient(145deg,#ffb25d,#e67e3e);box-shadow:inset 0 -6px #a9532d44,0 5px 10px #33487338;color:#7b3f25;font-weight:900;transition:left .16s ease,top .16s ease,transform .16s ease}.piece.selected{box-shadow:0 0 0 5px #ffdf54,0 7px 14px #33487355}.piece.hinted{box-shadow:0 0 0 5px #ffca3a}.walker{position:absolute;z-index:7;top:0;left:1%;font-size:35px;transform:translateX(-50%)}.walker.walking{animation:walk-across 2.4s linear forwards}.tool-row{display:grid;width:min(100%,720px);margin-top:10px;grid-template-columns:repeat(5,1fr);gap:7px}.tool-row button{min-height:44px;border-radius:14px;color:#3d5186;background:#eef2fb;font-weight:800}.tool-row button:disabled{opacity:.4}.tray-title{display:flex;width:min(100%,720px);margin:12px 0 7px;align-items:center;justify-content:space-between;color:#7180a4;font-size:13px}.tray-title strong{color:#334a82;font-size:16px}.tray{display:flex;width:min(100%,720px);min-height:72px;padding:8px;align-items:center;gap:9px;overflow-x:auto;border-radius:18px;background:#edf3fc}.tray-piece{display:grid;flex:0 0 auto;height:48px;place-items:center;border:3px solid #9a512d;border-radius:10px;color:#7b3f25;background:linear-gradient(145deg,#ffb25d,#e67e3e);box-shadow:inset 0 -5px #a9532d44;font-weight:900}.tray-piece.selected{outline:5px solid #ffdf54}.tray-piece.hinted{outline:5px solid #ffca3a}.test-button{margin-top:14px;background:linear-gradient(#60cf87,#35a65e);box-shadow:0 7px #267a46}.modal{position:fixed;inset:0;z-index:20;display:grid;padding:22px;place-items:center;background:#28315b61;backdrop-filter:blur(8px)}.hidden{display:none!important}.modal-card{width:min(420px,100%);padding:28px;border-radius:30px;text-align:center;background:#fff}.modal-card h2{color:#3f62bd}.award{font-size:64px}.result-grid{margin:20px 0}.modal-card .primary{width:100%}.text-button{min-height:44px;margin-top:14px;color:#6573a2;background:transparent;font-weight:800}.drag-ghost{position:fixed;z-index:50;width:70px;height:48px;pointer-events:none;border:3px solid #9a512d;border-radius:10px;background:#f39b50;opacity:.85;transform:translate(-50%,-50%)}@keyframes walk-across{0%{left:1%;transform:translateX(-50%) rotate(-4deg)}50%{transform:translateX(-50%) rotate(4deg)}100%{left:99%;transform:translateX(-50%) rotate(-4deg)}}@media(max-width:600px){.screen{padding-top:12px}.game header{grid-template-columns:46px 1fr 46px}.round{width:46px;height:46px}.hero{width:145px;height:100px}.play-panel{padding:10px}.status{align-items:flex-start;flex-direction:column;gap:4px}.status span{width:100%;text-align:center;font-size:13px}.scene{min-width:0}.board{border-width:4px}.tool-row{grid-template-columns:repeat(5,1fr)}.tool-row button{padding:3px;font-size:12px}.tray-title span{display:none}}@media(max-height:680px) and (orientation:landscape){.app{width:min(1100px,100%)}.game{display:grid;padding:8px 18px;grid-template-columns:270px 1fr;grid-template-rows:auto auto 1fr;gap:5px 12px}.game header,.status{grid-column:1}.play-panel{grid-column:2;grid-row:1/span 3;padding:7px}.scene-wrap{max-width:640px}.scene{padding-top:18px}.board{max-height:52vh;margin:auto}.tool-row{margin-top:5px}.tray-title{margin:5px 0 3px}.tray{min-height:55px;padding:5px}.tray-piece{height:40px}.test-button{min-height:42px;margin-top:5px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
