.control-point{fill:#1e90ff;cursor:pointer;transition:fill .3s ease,r .3s ease}.control-point:hover{fill:#63b3ed;r:2px}.control-point-inside,.control-point-outside{fill:orange}.control-point-inside:hover,.control-point-outside:hover{fill:#fc0}.spline{fill:none;stroke-width:.8px}.spline-main{stroke:#e53e3e}.spline-offset-inside{stroke:#f6ad55}.spline-offset-outside{stroke:#38b2ac}.toolbar{position:absolute;top:15px;left:15px;right:15px;display:flex;flex-direction:row;justify-content:space-between;align-items:center;z-index:100;background-color:#1e1e1ecc;padding:6px 8px;border-radius:8px}.steps{display:flex;align-items:center}.step{position:relative;display:inline-flex;align-items:center;height:26px;padding:2px 12px;margin-right:10px;border-radius:6px;background:linear-gradient(135deg,#555,#444);color:#fff;cursor:pointer;transition:background .3s ease,transform .2s ease}.step:last-child{margin-right:0}.step.active{background:linear-gradient(135deg,#007bff,#0056b3);transform:scale(1.05)}.step.completed{background:linear-gradient(135deg,#28a745,#1e7e34)}.step-modal{position:absolute;top:133%;left:50%;transform:translate(-50%);background:#000c;color:#ffffffb5;padding:4px 6px;border-radius:4px;white-space:normal;opacity:0;visibility:hidden;z-index:100;font-size:12px;min-width:220px;text-align:center}.step-modal:after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-6px;border-width:6px;border-style:solid;border-color:transparent transparent rgba(0,0,0,.8) transparent}.step:hover .step-modal{opacity:1;visibility:visible}.navigation-buttons{display:flex;align-items:center}.navigation-buttons button{margin-left:10px}button{display:flex;align-items:center;padding:5px 8px;font-size:14px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;color:#fff;background:linear-gradient(135deg,#6e8efb,#a777e3);box-shadow:0 4px 4px #0000001a}button:hover{background:linear-gradient(135deg,#5a7ce0,#9668c5);transform:translateY(-2px);box-shadow:0 6px 8px #00000026}button:active{background:linear-gradient(135deg,#4a6dc1,#8551a2);transform:translateY(0);box-shadow:0 4px 6px #0000001a}button:disabled{background:linear-gradient(135deg,#95a5a6,#bdc3c7)!important;cursor:not-allowed;box-shadow:none;transform:none}#nextStep{background:linear-gradient(135deg,#8e44ad,#a569bd)}#nextStep:hover{background:linear-gradient(135deg,#71368a,#916bbf)}#startOver{position:absolute;bottom:20px;right:20px;background:linear-gradient(135deg,#f1c40f,#f4d03f);box-shadow:0 4px 6px #0003;z-index:100;display:flex;align-items:left;width:115px}#startOver:hover{background:linear-gradient(135deg,#d4ac0d,#f7dc6f)}#startOver:active{background:linear-gradient(135deg,#b7950b,#f9e79f)}#runOptimization{background:linear-gradient(135deg,#16a085,#48c9b0)}#runOptimization:hover{background:linear-gradient(135deg,#138d75,#45b39d)}#newSpecs{position:absolute;bottom:55px;right:20px;background:linear-gradient(135deg,#f39c12,#f5b041);box-shadow:0 4px 6px #0003;z-index:100;display:none;align-items:left;width:115px}#newSpecs:hover{background:linear-gradient(135deg,#d68910,#f0b27a)}#newSpecs:active{background:linear-gradient(135deg,#b9770e,#edc293)}.track-controls{position:absolute;bottom:20px;left:20px;z-index:100;display:flex;align-items:center}.switch{position:relative;display:inline-block;width:50px;height:24px;margin-left:10px;vertical-align:middle}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#484848d5;transition:.4s;border-radius:4px;cursor:pointer;border:1px solid #005a19}.slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:2px;background-color:#fff;transition:.4s;border-radius:50%}.switch input:checked+.slider{background-color:#a7a7a7}.switch input:checked+.slider:before{transform:translate(26px)}.switch:after{content:"Complex Track";position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%);white-space:nowrap;opacity:0;transition:opacity .5s ease;color:#fff;font-size:14px;line-height:24px}.switch:hover:after{opacity:1}*{box-sizing:border-box;margin:0;padding:0}body{justify-content:center;min-height:100vh;background-color:#142115f0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#fff;overflow-y:auto}#appContainer{width:1600px;margin:0 auto;overflow-x:auto;display:block}#container2D{position:relative;width:790px;height:600px;border-radius:12px;overflow:visible;background-color:#343434;box-shadow:0 4px 20px #00000080;flex:0 0 auto}.bg-image{position:absolute;top:0;left:0;width:auto;height:100%;opacity:.3;z-index:0}#changeBgImage{z-index:100;background:linear-gradient(135deg,#6e8efb,#a777e3);border:none;padding:5px 8px;font-size:14px;font-weight:600;color:#fff;border-radius:8px;cursor:pointer}#changeBgImage:hover{background:linear-gradient(135deg,#5a7ce0,#9668c5);transform:translateY(-2px)}#changeBgImage:active{background:linear-gradient(135deg,#4a6dc1,#8551a2);transform:translateY(0)}#container2D svg{position:relative;z-index:1;width:100%;height:100%;background-color:transparent;transform:scale(1);transform-origin:center center}#topRow{display:flex;flex-direction:row;gap:10px;width:1640px;padding:10px 20px 5px;margin:0 auto;flex-wrap:nowrap}#container3D{position:relative;width:800px;height:600px;border-radius:12px;overflow:hidden;background-color:#2a2a2af6;box-shadow:0 4px 20px #00000080;flex:0 0 auto}#container3D .checkbox-wrapper{position:absolute;top:15px;left:15px;display:flex;flex-direction:column;gap:10px;background-color:#1e1e1ecc;padding:10px;border-radius:8px;z-index:20}.checkbox-container{display:flex;align-items:center;cursor:pointer;color:#fff;font-size:14px}.checkbox-container input{margin-right:8px;width:16px;height:16px;cursor:pointer}.checkbox-container:hover{background-color:#323232e6;border-radius:4px}.color-indicator{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:5px;border:1px solid #666}#bottomRow{display:flex;flex-direction:row;justify-content:flex-start;gap:10px;padding-left:20px;padding-right:20px;padding-bottom:10px;width:1640px;margin:0 auto}#lapTimeChartContainer{width:1600px;margin:5px 0;padding:10px;border:1px solid #ffffff;border-radius:12px;background-color:#1e1e1e;box-shadow:0 4px 20px #00000080;display:flex;flex-direction:row;align-items:flex-start;gap:10px;flex:0 auto}#lapTimePlot{width:780px;background:#2c2c2c;border-radius:10px}#compareResults{background-color:#3b3b3b;border-radius:12px;border:1px solid #474747;padding:10px;box-shadow:0 4px 20px #00000080;height:100%;width:790px}.run-row{display:flex;flex-direction:column;gap:6px;margin-bottom:10px;padding:8px;background-color:#2c2c2c;border-radius:8px}.run-row div{font-size:14px}.step-options{position:absolute;top:65px;left:15px;background-color:#1e1e1ee6;padding:8px 12px;border-radius:8px;z-index:10}.step-options label{display:inline-block;margin-right:8px;margin-bottom:6px;min-width:58px}.step-options input[type=number]{width:60px;padding:4px;border-radius:4px;border:none;font-size:14px}