@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";body{font-family:Arial,sans-serif;margin:0;padding:0}#root{display:grid;grid-template-rows:auto 1fr auto;min-height:100vh}header{background-color:#4caf50;color:#fff;padding:1em}header h1{text-align:center}main{padding:2em}section{margin-bottom:2em}footer{background-color:#333;color:#fff;padding:1em 0}footer p{text-align:center}a{color:#4caf50;text-decoration:none}a:hover{text-decoration:underline}body{font-family:Roboto,sans-serif;margin:0;padding:0;background-color:#f0f0f0;color:#333}header{background-color:#3e8e41;color:#fff;padding:15px;text-align:left;box-shadow:0 2px 4px #0000001a}header h1{margin:0;font-size:2em}main{padding:15px;max-width:100%;margin:0 auto}section{margin-bottom:20px;padding:15px;background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a}section h2{margin-top:0;color:#3e8e41;font-size:1.5em}section p{line-height:1.6;margin-bottom:10px}.step{margin-bottom:15px}.step h3{color:#3e8e41;font-size:1.25em;margin-bottom:5px}.step p{margin-bottom:5px}#graph-visualizer{text-align:left}footer{background-color:#222;color:#fff;text-align:left;padding:10px 20px;box-shadow:0 -2px 4px #0000001a}footer p{margin:0}input[type=number]{padding:10px;border:1px solid #ccc;border-radius:5px;margin:5px;font-size:1em;width:calc(100% / 3 - 22px);box-sizing:border-box;transition:border-color .3s ease,box-shadow .3s ease}input[type=number]:focus{border-color:#3e8e41;box-shadow:0 0 5px #3e8e4180;outline:none}button{padding:10px 15px;border:none;border-radius:5px;background-color:#3e8e41;color:#fff;font-size:1em;cursor:pointer;transition:background-color .3s ease}button:hover{background-color:#2d6a34}button:disabled{background-color:#a8c0a8;cursor:not-allowed}.array-container{display:flex;flex-wrap:wrap}.array-element{padding:10px;margin:5px;border:1px solid #ddd;border-radius:5px;background-color:#fff;text-align:center}.array-element.mid{border-color:red}.array-element.range{background-color:#e0ffe0}#cy{flex-grow:1;border:1px solid #ccc;flex:3;margin-left:10px;width:800px}#container{display:flex;align-items:stretch}#inp{flex:1;resize:none;padding:10px;border:1px solid #bbb;border-radius:4px;font-family:Courier New,Courier,monospace;background-color:#fff;box-shadow:0 1px 3px #0000001a;width:100%;height:400px;margin-bottom:10px;box-sizing:border-box}#inp:focus{outline:none;border-color:#3e8e41}button{width:100%;margin-top:10px;box-sizing:border-box}