body{margin:0;font-family:Arial,sans-serif}canvas{display:block}#controls{position:absolute;top:20px;left:-320px;z-index:100;background:#1c1c1ce6;padding:20px;border-radius:0 10px 10px 0;box-shadow:0 4px 6px #0000004d;color:#fff;width:280px;transition:left .3s ease}#controls.visible{left:0}.toggle-panel{position:absolute;right:-40px;top:50%;transform:translateY(-50%);background:#1c1c1ce6;color:#fff;border:none;padding:10px;cursor:pointer;border-radius:0 5px 5px 0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;transition:background .3s ease}.toggle-panel:hover{background:#282828e6}.toggle-icon{width:24px;height:24px;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white"><path d="M3 4h18v2H3V4zm0 7h18v2H3v-2zm0 7h18v2H3v-2z"/></svg>');background-size:contain;background-repeat:no-repeat;background-position:center;transition:transform .3s ease}#controls.visible .toggle-icon{transform:rotate(180deg)}.panel-title{font-size:16px;font-weight:700;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.2)}.control-group{margin-bottom:15px}.control-group:last-child{margin-bottom:0}.control-group label{display:block;margin-bottom:5px;color:#ccc;font-size:14px}.control-row{display:flex;align-items:center;gap:10px}.control-group input[type=range]{flex:1;height:5px;-webkit-appearance:none;background:#ffffff1a;border-radius:2px;outline:none}.control-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;background:#4a9eff;border-radius:50%;cursor:pointer;transition:background .2s}.control-group input[type=range]::-webkit-slider-thumb:hover{background:#2486ff}.control-group input[type=number]{width:60px;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:4px;padding:4px 8px;color:#fff;font-size:13px}.file-input{margin-bottom:20px}.file-input input[type=file]{display:none}.file-input label{display:block;padding:10px 15px;background:#4a9eff;color:#fff;border-radius:5px;cursor:pointer;text-align:center;transition:background .2s}.file-input label:hover{background:#2486ff}.file-name{margin-top:8px;font-size:12px;color:#ccc;word-break:break-all}.radio-group{display:flex;gap:15px;margin-top:5px}.radio-group label{display:flex;align-items:center;gap:5px;cursor:pointer;color:#fff;font-size:14px}.radio-group input[type=radio]{cursor:pointer}.export-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}.export-btn{flex:1;min-width:80px;padding:8px 12px;background:#4a9eff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background .2s}.export-btn:hover{background:#2486ff}.export-btn:active{background:#1a76e8}.export-status{position:fixed;bottom:20px;right:20px;padding:10px 20px;background:#000c;color:#fff;border-radius:4px;z-index:1000;display:none}.export-status.show{display:block;animation:fadeInOut 3s ease-in-out}@keyframes fadeInOut{0%{opacity:0}10%{opacity:1}90%{opacity:1}to{opacity:0}}.export-info{font-size:12px;color:#ccc;margin-bottom:5px}.export-info-list{margin:0 0 10px 20px;padding:0;font-size:12px;color:#ccc}.export-info-list li{margin-bottom:3px}#animation-controls{margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}.animation-select{margin-bottom:15px}.animation-select select{width:100%;padding:8px;background:#0000004d;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:4px}.animation-buttons{display:flex;gap:10px;margin-bottom:15px}.animation-buttons button{flex:1;padding:8px;background:#0000004d;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:4px;cursor:pointer;transition:background .2s}.animation-buttons button:hover{background:#ffffff1a}.animation-settings{margin-top:10px}.animation-settings .control-row{display:flex;align-items:center;margin-bottom:10px;gap:10px}.animation-settings label{flex:0 0 auto;min-width:80px;color:#ccc}.animation-settings input[type=range]{flex:1}.animation-settings .speed-value{flex:0 0 40px;text-align:right;color:#ccc}.animation-settings input[type=checkbox]{width:20px;height:20px;margin:0;cursor:pointer}