.game-link{text-decoration:none;font-size:20px;color:#007bff;display:inline-block;position:relative;padding:.2em .5em;overflow:hidden}.game-link:before{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:#003366;transform:translate(-100%);transition:transform .3s ease-out}.game-link:hover{color:#fff}.game-link:hover:before{transform:translate(0)}<file path="src/FifteenPuzzle.css"> ::selection{background:transparent}#controls{text-align:center}#controls button{cursor:pointer;outline:none;padding:10px 20px;margin:25px 2px;border:0;border-radius:4px;background:#77B5FE;font:700 14px Arial;text-align:center;text-transform:uppercase;text-shadow:-1px -1px 0 rgba(0,0,0,.5);color:#fff}#controls button:hover{background:#6495ED}#puzzle{position:relative;width:325px;height:325px;margin:80px auto 0;border:8px solid #6495ED;border-radius:4px}#puzzle span{position:absolute;display:block;width:80px;height:80px;border-radius:4px}#puzzle span.number{cursor:pointer;font:700 36px/80px Arial;text-align:center;text-shadow:-1px -1px 0 rgba(0,0,0,.5);color:#fff}#puzzle span.empty{background:transparent}#puzzle span.number.light,#puzzle span.number.dark{background:#5DADE2}#puzzle.animate span{-webkit-transition:.15s left,.15s top;transition:.15s left,.15s top}.success-message{font-size:24px;color:green;text-align:center;margin-top:20px}.controls-container{display:flex;justify-content:center;margin-bottom:20px}.game-button{padding:16px 32px;font-size:24px;border:2px solid #ccc;border-radius:10px;cursor:pointer;background-color:#f9f9f9;transition:background-color .3s ease,transform .1s ease;box-shadow:0 2px 4px #0000001a;margin:0 10px}.game-button:hover{background-color:#e0e0e0;transform:scale(1.05)}</file> .game-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:100vh;padding:20px;box-sizing:border-box}.shulte-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:calc(100% - 40px);max-width:500px;margin:70px auto 20px;padding:10px;background:white;border-radius:8px;box-shadow:0 2px 10px #0000001a;box-sizing:border-box}.shulte-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:24px;background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;cursor:pointer;transition:all .2s ease;-webkit-user-select:none;user-select:none;padding:10px;box-sizing:border-box}.shulte-cell:hover{background:#e9ecef}.shulte-cell.selected{background-color:#4dabf7!important;color:#fff}.shulte-cell.hover-highlight:hover{background-color:#ffd43b!important}.shulte-cell.traced{background-color:#a5d8ff!important}.shulte-cell.hit-success{animation:hitSuccess .3s ease}.shulte-cell.hit-error{animation:hitError .3s ease}@keyframes hitSuccess{0%{background-color:#40c057}to{background-color:#f8f9fa}}@keyframes hitError{0%{background-color:#fa5252}to{background-color:#f8f9fa}}.turned{transform:rotate(var(--rotation-angle))}.spinning{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.timer{font-size:24px;margin-top:20px;color:#495057;text-align:center}.game-button{padding:12px 24px;font-size:18px;color:#fff;background:#339af0;border:none;border-radius:4px;cursor:pointer;transition:background .2s ease;margin:0 10px}.game-button:hover:not(:disabled){background:#228be6}.game-button:disabled{background:#adb5bd;cursor:not-allowed}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:white;padding:30px;border-radius:10px;width:90%;max-width:500px;max-height:80vh;overflow-y:auto}.options-grid{display:grid;gap:15px;margin-top:20px}.option-item{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#f8f9fa;border-radius:5px}.option-label{font-size:16px;color:#495057}.option-control{display:flex;align-items:center;gap:10px}.option-control input[type=checkbox]{width:20px;height:20px;cursor:pointer}.option-control input[type=number],.option-control select{padding:5px 10px;border:1px solid #dee2e6;border-radius:4px;font-size:16px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-title{font-size:24px;color:#212529;margin:0}.close-button{background:none;border:none;font-size:24px;cursor:pointer;color:#495057}.close-button:hover{color:#212529}@media (max-width: 768px){.shulte-grid{width:calc(100% - 20px);margin:60px auto 20px;padding:5px;gap:5px}.shulte-cell{font-size:18px;padding:5px}.game-button{font-size:16px;padding:10px 20px}.timer{font-size:20px}}.top-controls{position:fixed;top:0;left:0;width:100%;background-color:#ffffffe6;padding:10px;display:flex;align-items:center;justify-content:space-between;z-index:100;box-shadow:0 2px 4px #0000001a}.options-icon-button{background:none;border:none;cursor:pointer;font-size:24px;padding:5px}<file path="src/index.css"> html,body,#root{margin:0;padding:0;height:100%;overflow:hidden}body{font-family:Arial,sans-serif;display:flex;justify-content:center;align-items:center;background-color:#f0f8ff}.game-container{position:relative;text-align:center;background-color:#fff;border-radius:12px;box-shadow:0 4px 8px #0000001a;width:100vw;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px;box-sizing:border-box;transform:scale(1)}@media (max-width: 480px){.game-container{transform:scale(.8)}}@media (orientation: landscape){.game-container{transform:scale(.9)}}.top-controls{position:absolute;top:10px;left:0;width:100%;background-color:#f0f0f0cc;padding:5px 10px;display:flex;align-items:center;justify-content:space-between;z-index:10;box-sizing:border-box;border-radius:8px;box-shadow:0 2px 5px #0003;background:linear-gradient(to bottom,#f8f8f8,#f0f0f0);flex-wrap:wrap}.top-controls h2{margin:0;font-size:20px;color:#333;flex-grow:1;text-align:center}.animation-toggle-container{margin-right:auto;margin-left:5px}.animation-toggle-button{background:none;border:none;cursor:pointer;font-size:24px;padding:5px;opacity:1;color:#007bff;text-shadow:1px 1px 2px rgba(0,0,0,.3);transition:opacity .3s ease}.animation-toggle-button:hover{opacity:1}.home-icon{z-index:10;margin-right:5px}.level-select-container{display:flex;gap:5px;z-index:10;width:auto}.level-button{border:none;padding:10px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;width:40px;height:40px;transition:background-color .3s ease}.level-button.easy{background-color:#66bb6a;color:#fff}.level-button.medium{background-color:#ffa726;color:#fff}.level-button.hard{background-color:#ef5350;color:#fff}.level-button.active{box-shadow:0 0 0 2px #fff,0 0 0 4px #4caf50}.operation-select-container{display:flex;gap:5px;margin-top:0;justify-content:center;width:auto;position:absolute;top:100px}.operation-button{padding:8px;cursor:pointer;border-radius:50%;transition:background-color .3s ease;font-size:20px;display:flex;align-items:center;justify-content:center;border:1px solid #ccc;background-color:#f9f9f9;width:40px;height:40px}.operation-button.active{background-color:#e0e0e0}.progress-bar-container{width:80%;height:12px;background-color:#ddd;margin-top:20px;border-radius:6px;position:absolute;bottom:20px}.progress-bar{height:100%;background-color:#4caf50;border-radius:6px;transition:width .3s ease}.question{font-size:32px;margin-bottom:30px;color:#333}.options-container{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin-bottom:40px}.option{padding:16px 32px;font-size:24px;border:2px solid #ccc;border-radius:10px;cursor:pointer;background-color:#f9f9f9;transition:background-color .3s ease,transform .1s ease;box-shadow:0 2px 4px #0000001a}.option:hover{background-color:#e0e0e0;transform:scale(1.05)}.option.correct{background-color:#4caf50;color:#fff;border-color:#4caf50}.option.incorrect{background-color:#f44336;color:#fff;border-color:#f44336}.score{font-size:24px;margin-bottom:15px;color:#555}#confetti-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1000}.magic-square{display:flex;flex-direction:column;border:1px solid #ccc;margin-bottom:20px}.magic-square-row{display:flex}.magic-square-cell{width:60px;height:60px;border:1px solid #ccc;display:flex;align-items:center;justify-content:center;font-size:24px;cursor:pointer}.magic-square-cell.selected{background-color:#ffc}.magic-square-cell.missing{background-color:#b0e2ff}.home-page{display:flex;flex-direction:column;align-items:center;font-family:Arial,sans-serif}.home-page h1{margin-bottom:20px}.home-page ul{list-style:none;padding:0}.home-page li{margin-bottom:10px}.home-page a{text-decoration:none;font-size:18px;color:#007bff}.puzzle{font-size:32px;margin-bottom:20px}.missing-number-button{padding:8px 16px;font-size:24px;border:2px solid #ccc;border-radius:10px;cursor:pointer;background-color:#f9f9f9;transition:background-color .3s ease,transform .1s ease;box-shadow:0 2px 4px #0000001a}.missing-number-button:hover{background-color:#e0e0e0;transform:scale(1.05)}.game-container.shake{animation:shake .3s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.puzzle-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:10px;width:300px;margin-bottom:20px}.puzzle-tile{width:70px;height:70px;font-size:24px;border:2px solid #ccc;border-radius:10px;cursor:pointer;background-color:#f9f9f9;transition:background-color .3s ease,transform .1s ease;box-shadow:0 2px 4px #0000001a}.puzzle-tile:hover{background-color:#e0e0e0;transform:scale(1.05)}.puzzle-tile.empty{background-color:#fff;border:2px dashed #ccc;box-shadow:none;cursor:default}.moves-count{font-size:18px;color:#555}</file>{}