:root{--lab:#ffb547;--lab-dark:#d9861a}h1 span{background:linear-gradient(90deg,#d9861a,#ff6f91 55%,#3ccf7a);color:#0000;-webkit-background-clip:text;background-clip:text}.steps{justify-items:center;gap:18px;width:100%;max-width:720px;margin:0 auto;display:grid}.yard{--size:min(110px, calc((100vw - 48px) / var(--cols)), calc(42vh / var(--rows)));grid-template-columns:repeat(var(--cols), var(--size));grid-template-rows:repeat(var(--rows), var(--size));box-shadow:inset 0 0 0 4px #8cc85f, var(--shadow);background:#b9e88a;border-radius:22px;gap:6px;padding:10px;display:grid;position:relative}.cell{background:#fff3d6;border-radius:14px;place-items:center;display:grid}.cell svg{width:78%;height:auto}.bush-cell{background:0 0}.bone-wrap svg{width:100%}.yard.happy .bone-wrap{animation:.4s ease-in forwards gone}@keyframes gone{to{transform:scale(0)}}.pup-wrap{left:calc(10px + var(--col,0) * (var(--size) + 6px));top:calc(10px + var(--row,0) * (var(--size) + 6px));width:var(--size);height:var(--size);pointer-events:none;filter:drop-shadow(0 3px #2b244040);place-items:center;transition:left .38s,top .38s;display:grid;position:absolute}.pup-wrap svg{width:86%;height:auto}.yard.happy .pup-wrap{animation:.5s ease-in-out 2 jump}@keyframes jump{50%{transform:translateY(-22%)}}.wiggle{animation:.4s wiggle}@keyframes wiggle{25%{transform:translate(-8px)}75%{transform:translate(8px)}}.arrows{grid-template-columns:repeat(4,88px);gap:12px;display:grid}.arrow-btn,.step-card{cursor:pointer;color:#ffb547;width:88px;height:88px;box-shadow:var(--shadow), inset 0 0 0 4px #ffd08a;touch-action:manipulation;background:#fff;border:0;border-radius:22px;place-items:center;display:grid}.arrow-btn:active,.step-card:active{transform:translateY(3px)}.arrow-btn svg{width:64px;height:64px}.plan-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;width:100%;display:flex}.plan{background:#fff;border-radius:20px;flex-wrap:wrap;flex:260px;gap:8px;min-width:200px;max-width:520px;min-height:76px;padding:8px;display:flex;box-shadow:inset 0 0 0 3px #f0dcae}.plan .step-card{pointer-events:none;color:#4d8dff;border-radius:16px;width:60px;height:60px;box-shadow:inset 0 0 0 3px #bcd3ff}.plan.fixing .step-card{pointer-events:auto;width:80px;height:80px}.plan .step-card svg{width:44px;height:44px}.plan.fixing .step-card svg{width:52px;height:52px}.plan .step-card.now{box-shadow:inset 0 0 0 5px var(--go);transform:scale(1.08)}.plan .step-card.oops{animation:.4s wiggle;box-shadow:inset 0 0 0 5px #ff9f43}.pop{animation:.25s ease-out pop}@keyframes pop{0%{transform:scale(.5)}}.round-btn{cursor:pointer;width:88px;height:88px;box-shadow:var(--shadow);touch-action:manipulation;border:0;border-radius:50%;place-items:center;display:grid}.round-btn svg{width:46px;height:46px}.go-btn{background:var(--go);color:#fff;box-shadow:0 5px 0 var(--go-dark)}.undo{background:var(--soft);color:var(--ink)}@media (width<=420px){.arrows{grid-template-columns:repeat(4,76px);gap:8px}.arrow-btn{width:76px;height:76px}.round-btn{width:80px;height:80px}}