*{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:#1a1a2e;width:100%;height:100%;overflow:hidden}.app{color:#e0e0e0;width:100vw;height:100vh;font-family:Segoe UI,system-ui,-apple-system,sans-serif;display:flex;overflow:hidden}.panel-toggle{z-index:20;color:#7ec8e3;cursor:pointer;background:#16213e;border:1px solid #2a3a5c;border-radius:4px;justify-content:center;align-items:center;width:32px;height:32px;font-size:18px;line-height:1;transition:left .25s;display:flex;position:absolute;top:8px;left:8px}.panel-toggle:hover{background:#1a4a7a}.app:has(.controls:not(.controls-hidden)) .panel-toggle{left:288px}.controls{background:#16213e;border-right:1px solid #2a3a5c;width:280px;min-width:280px;padding:16px;transition:margin-left .25s,opacity .25s;overflow-y:auto}.controls-hidden{opacity:0;pointer-events:none;margin-left:-280px}.controls h2{color:#7ec8e3;margin:0 0 4px;font-size:15px}.controls .subtitle{color:#6a8caa;margin:0 0 16px;font-size:12px}.controls .math{font-style:italic}.controls h3{color:#a0b4cc;text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px;font-size:11px}.control-group{border-bottom:1px solid #2a3a5c;margin-bottom:18px;padding-bottom:14px}.control-group:last-child{border-bottom:none}.control-group label{font-variant-numeric:tabular-nums;margin-bottom:8px;font-size:13px;display:block}.slider-row{margin-bottom:8px;font-size:13px;display:block}.slider-label{align-items:center;gap:4px;display:flex}.slider-number{color:#e0e0e0;font-variant-numeric:tabular-nums;background:#1a1a2e;border:1px solid #2a3a5c;border-radius:3px;width:70px;padding:2px 4px;font-size:13px}.slider-number::-webkit-inner-spin-button{opacity:1}.slider-number::-webkit-outer-spin-button{opacity:1}.control-group input[type=range]{accent-color:#7ec8e3;width:100%;margin-top:4px}.control-group select{color:#e0e0e0;background:#1a1a2e;border:1px solid #2a3a5c;border-radius:3px;margin-left:8px;padding:2px 6px}.checkbox-label{align-items:center;gap:0;display:flex!important}.control-group input[type=checkbox]{accent-color:#7ec8e3;margin-right:6px}.control-group button{color:#7ec8e3;cursor:pointer;background:#0f3460;border:1px solid #7ec8e3;border-radius:4px;width:100%;padding:8px 16px;font-size:13px;transition:background .2s}.control-group button:hover{background:#1a4a7a}.control-group button:active{background:#245a8a}.winding-mode{margin-bottom:8px}.winding-display{font-variant-numeric:tabular-nums;margin-bottom:8px;font-size:13px}.winding-inputs{gap:12px;margin-bottom:8px;display:flex}.winding-inputs label{align-items:center;gap:6px;margin-bottom:0!important;display:flex!important}.winding-inputs input[type=number]{color:#e0e0e0;background:#1a1a2e;border:1px solid #2a3a5c;border-radius:3px;width:60px;padding:3px 6px;font-size:13px}.info{border-top:1px solid #2a3a5c;margin-top:12px;padding-top:12px}.info p{color:#6a8caa;margin:0 0 6px;font-size:11px;line-height:1.4}.canvas-container{flex:1;position:relative}@media (width<=600px){.controls{z-index:10;position:absolute;top:0;bottom:0;left:0}.controls-hidden{margin-left:-280px}}