body,html{height:100%;margin:0;padding:0}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;background-color:#fff;color:#333;display:flex;justify-content:center;align-items:center;overscroll-behavior-y:contain}#main-container{display:flex;flex-direction:column;align-items:center}#game-container{text-align:center}#loading-indicator{padding:40px;display:flex;justify-content:center;align-items:center;min-height:150px}#loading-indicator::after{content:'';display:block;width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #555;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}#grid{display:grid;border:1px solid #e0e0e0;background-color:#fff;margin:20px auto;touch-action:none;gap:0;width:max-content;padding:0;line-height:0;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-touch-callout:none}.cell{width:50px;height:50px;box-sizing:border-box;display:flex;justify-content:center;align-items:center;font-size:1.8em;cursor:pointer;position:relative;transition:background-color .1s ease,outline-color .2s ease;overflow:hidden;border:1px solid #f0f0f0;line-height:1;outline:2px solid transparent;outline-offset:-2px}.cell.start::before{content:'🚶';z-index:1;position:relative;display:inline-block;transform:scaleX(-1);font-size:.9em;animation:pulse-start 1.5s infinite ease-in-out}.cell.end::before{content:'🏠';z-index:1;position:relative;display:inline-block;font-size:.9em;transition:transform .4s ease-in-out,opacity .4s ease-in-out}@keyframes pulse-start{0%,100%{transform:scaleX(-1) scale(1);opacity:1}50%{transform:scaleX(-1) scale(1.1);opacity:.8}}.cell.start.pressed::before,.cell.start:hover::before{animation:none}.cell.start.pressed{background-color:#e0e0e0!important;animation:none!important}.cell.start:hover:not(.pressed){background-color:#f5f5f5}.cell.source::before{content:'🔑';display:inline-block;color:var(--source-color,#333);z-index:1;position:relative;font-size:.9em;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}.cell.start.source::before{content:'🚶';filter:none;color:initial;animation:pulse-start 1.5s infinite ease-in-out}.cell.end.source::before{content:'🏠';filter:none;color:initial}.cell.target{background-color:var(--target-bg-color,rgba(128,128,128,.4));background-clip:padding-box}.cell.target::before{content:'🚪';display:inline-block;width:auto;height:auto;border-radius:0;border:none;background-color:rgba(255,255,255,.1);padding:0 2px;border-radius:3px;opacity:1;margin:0;z-index:1;position:relative;font-size:.9em}.cell.target.satisfied{outline-color:#32cd32!important}.cell.target.failed{outline-color:#dc143c!important}.cell.target-pulse-error{animation:pulse-target-cell .5s ease-in-out 2}@keyframes pulse-target-cell{0%,100%{outline-color:#dc143c}50%{outline-color:orange;outline-width:3px}}.cell.end-pulse-error::before{animation:pulse-end .8s ease-in-out 2}@keyframes pulse-end{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.6}}.cell.path{opacity:.7;transition:background-color 50ms linear}.cell.path.end{opacity:1}.cell.path.start::before{opacity:1!important;z-index:1;position:relative;transition:none}.cell.solution-path{background-color:rgba(200,200,200,.15)}.cell.solution-path::after{content:attr(data-solution-step);position:absolute;bottom:1px;right:2px;font-size:.45em;font-weight:400;color:rgba(0,0,0,.3);line-height:1;z-index:2}.cell.source.solution-path{z-index:0}.cell.target.solution-path::before{z-index:3}.cell.end.solution-path::before,.cell.start.solution-path::before{z-index:3}.cell.path-invalid{animation:pulse-fade-red .9s ease-out forwards}@keyframes pulse-fade-red{0%{background-color:inherit;opacity:.7}15%,45%{background-color:rgba(255,100,100,.6);opacity:.8}30%,60%{background-color:inherit;opacity:.7}100%{background-color:inherit;opacity:0}}#buttons-container{margin-top:25px}button{padding:6px 12px;font-size:1.4em;cursor:pointer;background-color:#f0f0f0;color:#444;border:1px solid #dcdcdc;border-radius:4px;transition:background-color .2s ease,border-color .2s ease,color .2s ease,opacity .3s;margin:0 5px;line-height:1;min-width:44px;min-height:44px}button:hover{background-color:#e0e0e0;border-color:silver;color:#111}button:disabled{opacity:.5;cursor:not-allowed;background-color:#f5f5f5!important;border-color:#e0e0e0!important;color:#aaa!important}button#skip-cheat-button{background-color:#fff3cd;border-color:#ffeeba;color:#856404}button#skip-cheat-button:hover{background-color:#ffeeba;border-color:#ffdf7e}