:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background-color:#2a3335;color:gray;justify-content:center;align-items:center;min-height:100vh}body.dark-mode{--background-color: black;--text-color: rgba(102, 111, 56, .87)}body.dark-mode h1,body.dark-mode h2,body.dark-mode h3,body.dark-mode h4,body.dark-mode h5,body.dark-mode h6{color:#fff}body.dark-mode p{color:#ffffffde}header{display:flex;justify-content:center;align-items:center;background-color:#1a4870;color:#1a1919;padding:20px;position:relative;height:10vh;transition:background-color .3s ease}header h1{font-size:35px;color:beige;font-family:Times New Roman,Times,serif}header button{position:absolute}body.dark-mode header{background-color:#2a3335;color:#fff}button{right:10px;background:#0a97b0;color:beige;border:none;padding:5px 10px;font-size:12px;cursor:pointer;border-radius:5px;transition:.3s}button:hover{background:#2a3335}body.dark-mode button{background:#f2c988;color:#5c4b4b}footer{height:2vh;margin:2px}main{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:.5% 2% 2%;background:#fff;height:86vh}body.dark-mode main{background-color:#3d3d3d;color:#fff}#graphArea{background:#b4d6cd;padding:15px;border-radius:8px;box-shadow:0 4px 8px #2a4f509f;width:100%;height:100%}#graph{height:93%;background-color:#fff;border:2px dashed #00796b;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px}#graphButtons{display:flex;flex-direction:row;justify-content:center;padding-top:7px}#pauseButton{margin-right:8px;margin-left:8px}body.dark-mode #graphArea{background-color:#2a3335;box-shadow:0 4px 4px #5c7968;color:#e0e0e0}body.dark-mode #graph{background-color:#333;color:#e0e0e0;border-color:#4caf50}form{display:flex;flex-direction:column;align-items:flex-start;background:#b4d6cd;padding:2%;border-radius:5px;box-shadow:0 4px 8px #2a4f509f;font-size:14px;font-weight:700;width:100%;margin-bottom:1.5%}form p{font-weight:400;margin:.5%;color:#333}.input-box{padding:.2%;margin-bottom:1%;border:2px solid #333;border-radius:5px;text-align:center;font-size:14px;width:25%;color:#000;background-color:#f0f8ff}input[list=Sortings]{padding:2px;border:2px solid #333;border-radius:5px;font-size:14px;width:40%;color:#000;background-color:#f0f8ff}#submit-container{display:flex;justify-content:flex-end;margin-left:93%;position:relative}h1{justify-content:center}body.dark-mode form{background:#2a3335;color:#fff;box-shadow:0 4px 4px #5c7479}body.dark-mode form p{color:#d3d3d3}body.dark-mode .input-box,body.dark-mode input[list=Sortings]{border:2px solid #555;background-color:#444;color:#fff}body.dark-mode h1{color:#fff}.characterstic-container{max-height:24vh;overflow-y:hidden;padding:10px;border:1px solid #ccc;border-radius:5px;scrollbar-width:thin}.characterstic-container::-webkit-scrollbar{width:8px}.characterstic-container:hover{overflow-y:scroll;scrollbar-color:rgb(232,235,224) white}body.dark-mode .characterstic-container{background-color:#000;color:#ffffff80;border:1px solid white}body.dark-mode .characterstic-container:hover{scrollbar-color:rgba(255,255,255,.5) #333333}#algorithm-container::-webkit-scrollbar{width:8px;color:gray;background-color:#f1f1f1}#algorithm-container{height:25vh}#algorithm-container::-webkit-scrollbar-thumb{background-color:gray;border-radius:4px}#algorithm-container{max-height:24vh;max-width:48vw;overflow-y:hidden;overflow-x:hidden;padding:10px;border:1px solid #ccc;border-radius:5px;background:#fff;scrollbar-width:thin;scroll-padding:10px;white-space:nowrap}#algorithm-container:hover{overflow-x:scroll;overflow-y:scroll;scrollbar-color:rgb(232,235,224) white}body.dark-mode #algorithm-container{background-color:#000;color:#ffffffde}body.dark-mode #algorithm-container:hover{scrollbar-color:rgba(255,255,255,.5) #333333}pre{font-family:Arial,Helvetica,sans-serif;font-size:normal}h2,h3{color:#000}p{color:gray}ul{color:gray;list-style-type:disc;padding-left:20px}.introduction-container{max-height:25vh;overflow-y:hidden;padding:10px;border:1px solid #ccc;border-radius:5px;scrollbar-width:thin;width:60%}.introduction-container:hover{overflow-y:scroll;scrollbar-color:rgb(232,235,224) white}body.dark-mode h2,body.dark-mode h3{color:#fff}body.dark-mode p,body.dark-mode ul{color:#d3d3d3}body.dark-mode .introduction-container{background-color:#000;color:#fff;border:1px solid white}body.dark-mode .introduction-container:hover{scrollbar-color:rgba(255,255,255,.5) #333333}img{max-width:500px;height:25vh;display:block;border-radius:5px;box-shadow:0 4px 8px #0000001a}#Image-tag{width:38%}body.dark-mode img{box-shadow:0 4px 8px #ffffff1a;filter:grayscale(50%) brightness(1) opacity(.8)}#first-section{display:flex;flex-direction:row;justify-content:space-between}#left{display:flex;flex-direction:column;justify-content:space-between}body.dark-mode #left{--background-color: #333333;--text-color: rgba(255, 255, 255, .87)}body.dark-mode #left h2,body.dark-mode #left p{color:var(--text-color)}#right{display:flex;flex-direction:column;width:100%}body.dark-mode #right{--background-color: #333333;--text-color: rgba(255, 255, 255, .87)}body.dark-mode #right h2,body.dark-mode #right p{color:var(--text-color)}