@import url(https://fonts.googleapis.com/css?family=Droid+Sans);:root{--primary-color:#5ddcff;--secondary-color:#2ad1ff;--background-color:#1a1a1a;--text-color:#e5e5e5;--font-family:'Droid Sans',sans-serif;--heading-font-family:'Droid Sans',sans-serif}body,html{margin:0;overflow:hidden;font-size:12px;transform:translateZ(0);font-family:var(--font-family);background-color:var(--background-color);background:var(--background-color)}.container{display:flex;flex-direction:row;height:100vh;box-sizing:content-box;justify-content:center;align-items:center;position:relative}.canvas-container{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;position:relative;padding:2px;border-top-left-radius:50px;border-top-right-radius:0;border-bottom-left-radius:50px;border-bottom-right-radius:0;border-left:2px solid rgba(90,220,255,1);border-right:2px solid rgba(90,220,255,1);border-radius:50px;background-color:#000;overflow:hidden}#torusCanvas{display:block}.title{width:260px;line-height:14px;position:absolute;top:2px;left:0;right:0;color:var(--primary-color);font-family:var(--font-family);font-size:14px;text-align:center;z-index:9;margin:auto}.controls{padding:10px;display:flex;flex-direction:column;background-color:var(--background-color);color:var(--primary-color);margin-right:5px}.control-item{display:flex;align-items:center;gap:2px;justify-content:center}#infoButton,.button-container{display:none}.slider-label{font-family:var(--font-family);width:28px;text-align:right;padding-right:2px;font-size:18px;line-height:22px;margin-top:-4px}input[type="range"]{width:320px;height:32px;accent-color:var(--primary-color);cursor:ew-resize}.control-value{color:var(--primary-color);font-family:var(--font-family);margin-left:2px;min-width:40px;font-size:14px;line-height:22px;margin-top:-2px}.button-container{display:grid;grid-template-columns:repeat(3,100px);justify-content:center;align-items:center;padding-left:0;margin:0}#infoButton{width:95px;bottom:0;background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));color:var(--background-color);border:0;border-radius:1px;font-family:var(--font-family);font-weight:bold;cursor:pointer;transition:background-color .3s ease,color .3s ease;box-shadow:0 4px 8px rgba(0,0,0,0.2)}#infoButton:hover{background:linear-gradient(45deg,var(--secondary-color),var(--primary-color))}.content{max-width:800px;margin:0 auto;padding:20px;color:#1a1a1a;font-family:'Open Sans';border-radius:1px;background-color:#f1f2f3}h1{color:var(--primary-color);font-family:var(--heading-font-family)}.download-button{display:flex;justify-content:center;margin-top:30px}.download-button a,button{text-decoration:none;color:var(--background-color);background-color:var(--primary-color);padding:5px 10px;border-radius:1px;border:0;font-family:var(--font-family);line-height:14px;font-weight:bold;transition:background-color .3s ease;box-shadow:0 2px 4px rgba(0,0,0,0.1);cursor:pointer}.download-button a:hover,button:hover{background-color:var(--secondary-color)}footer{display:block;position:relative;text-align:center;padding:10px;background-color:var(--background-color);color:var(--primary-color);font-size:12px;margin-top:0;margin-bottom:120px}.logo-container{display:block;position:absolute;justify-content:center;align-items:center;height:32px;top:3px;left:3px;z-index:9;padding:5px}.logo{width:32px;height:32px}.popup{display:none;position:fixed;top:0;left:50%;transform:translateX(-50%);width:90vw;max-width:800px;background-color:white;box-shadow:0 4px 8px rgba(0,0,0,0.2);padding:20px;z-index:1000}.popup-content{font-size:16px;height:100%;max-height:500px;padding:20px;padding-bottom:80px;overflow-y:auto}.popup-header{display:flex;justify-content:space-between;align-items:center}.popup-header h2{margin:0}.popup-close{cursor:pointer;font-size:3em}.popup-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:999}.switch{position:relative;display:inline-block;width:32px;height:16px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left 0;right:0;bottom:0;background-color:#ccc;transition:.4s;border-radius:1px}.slider:before{position:absolute;content:"";height:12px;width:12px;left:2px;bottom:2px;background-color:white;transition:.4s;border-radius:1px}input:checked+.slider{background-color:var(--primary-color)}input:focus+.slider{box-shadow:0 0 1px var(--primary-color)}input:checked+.slider:before{transform:translateX(16px)}.slider.round{border-radius:1px}.slider.round:before{border-radius:1px}.dimension-switch{text-align:right;padding-right:20px}.dimension-switch a{display:block;text-decoration:none;line-height:14px;color:var(--primary-color)}.dimension-switch a:hover{color:var(--secondary-color)}.dimension-switch .inactive-link{color:var(--primary-color);pointer-events:none;cursor:default}.dimension-tabs{display:flex;justify-content:center}.tab{padding:6px 0;width:40%;max-width:200px;text-align:center;background-color:var(--background-color);color:var(--primary-color);border:1px solid var(--primary-color);border-radius:1px;text-decoration:none;transition:background-color .3s ease;font-weight:bold;border:1px solid var(--primary-color);box-sizing:content-box;cursor:pointer;transition:background-color .3s ease,color .3s ease,box-shadow .3s ease;font-family:var(--heading-font-family);text-transform:uppercase;margin:5px;margin-bottom:0}.tab:hover{background-color:var(--primary-color);color:var(--background-color);box-shadow:0 0 10px var(--primary-color)}.tab.active{background-color:var(--primary-color);color:var(--background-color);box-shadow:0 0 15px var(--secondary-color)}@media screen and (max-width:840px){.container{flex-direction:column;height:85vh;border-top-left-radius:50px;border-top-right-radius:50px;border-bottom-left-radius:0;border-bottom-right-radius:0}.canvas-container{min-height:calc(85vh - 220px)}.controls{padding:8px;margin-right:0;margin:auto}input[type="range"]{width:250px;height:28px}.popup-content{height:911px}.dimension-tabs{align-items:center}.tab{text-align:center}.canvas-container{border-top:2px solid rgba(90,220,255,1);border-bottom:2px solid rgba(90,220,255,1);border-left:0;border-right:0}.title{top:0;border-radius:0;border-bottom-left-radius:1px;border-bottom-right-radius:1px}}