*{margin:0;padding:0;box-sizing:border-box}body{overflow:hidden;background:#1a1a2e;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif}#canvas{display:block;width:100vw;height:100vh}#error{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:16px;text-align:center;background:#dc2626e6;padding:24px 40px;border-radius:12px;max-width:500px;line-height:1.5}#settings-panel{position:fixed;top:12px;left:12px;z-index:100;width:240px;background:#1e1e1e;border:1px solid #3d3d3d;border-radius:3px;font-size:11px;color:#c8c8c8;user-select:none;overflow:hidden}#settings-panel.collapsed #settings-content,#settings-panel.collapsed .panel-hint,#settings-panel.collapsed .panel-actions,#settings-panel.hidden{display:none}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;background:#2b2b2b;border-bottom:1px solid #3d3d3d;border-radius:3px 3px 0 0}.panel-title{font-weight:500;color:#e0e0e0;font-size:11px}#settings-toggle{background:none;border:none;color:gray;font-size:14px;cursor:pointer;padding:0 4px;line-height:1}#settings-toggle:hover{color:#c8c8c8}#settings-content{padding:0;max-height:70vh;overflow-y:auto;background:#1e1e1e}#settings-content::-webkit-scrollbar{width:6px}#settings-content::-webkit-scrollbar-track{background:#1e1e1e}#settings-content::-webkit-scrollbar-thumb{background:#4a4a4a;border-radius:3px}.section{border-bottom:1px solid #3d3d3d}.section:last-of-type{border-bottom:none}.section summary{padding:6px 8px;cursor:pointer;background:#252525;list-style:none;display:flex;align-items:center;color:#b0b0b0;font-weight:500}.section summary::-webkit-details-marker{display:none}.section summary:before{content:">";margin-right:6px;font-size:9px;color:#707070;transition:transform .15s;display:inline-block}.section[open] summary:before{transform:rotate(90deg)}.section summary:hover{background:#2a2a2a}.section-content{padding:6px 12px 6px 8px;background:#1e1e1e}.setting-row{display:flex;align-items:center;margin-bottom:6px;gap:6px}.setting-row label{flex:0 0 60px;color:#a0a0a0;font-size:11px}.setting-row input[type=range]{flex:1;min-width:0;height:3px;background:#3d3d3d;border-radius:1px;appearance:none;cursor:pointer}.setting-row input[type=range]::-webkit-slider-thumb{appearance:none;width:10px;height:10px;border-radius:50%;background:#6a9fd4;cursor:pointer;border:none}.setting-row input[type=range]::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#6a9fd4;border:none;cursor:pointer}.setting-row input[type=range]:hover::-webkit-slider-thumb{background:#7eb3e8}.setting-row select{flex:1;background:#2b2b2b;border:1px solid #3d3d3d;color:#c8c8c8;padding:3px 6px;font-size:11px;border-radius:2px;cursor:pointer;text-align:center}.setting-row select option{text-align:center}.setting-row select:hover{border-color:#5a5a5a}.setting-row select:focus{outline:none;border-color:#6a9fd4}.value-display{flex:0 0 30px;text-align:right;color:#6a9fd4;font-size:10px;font-family:Consolas,Monaco,monospace}.preset-buttons{display:flex;justify-content:center;gap:8px;font-size:10px}.preset-item{color:#a0a0a0;cursor:pointer;border:none;background:none;font-family:inherit;font-size:inherit}.preset-item:hover{color:#c8c8c8}.preset-item.active{color:#6a9fd4}.color-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 8px}.color-row{display:flex;align-items:center;gap:6px}.color-row label{flex:1;color:#a0a0a0;font-size:10px}.color-row input[type=color]{width:24px;height:18px;border:1px solid #3d3d3d;border-radius:2px;padding:0;cursor:pointer;background:none}.color-row input[type=color]::-webkit-color-swatch-wrapper{padding:1px}.color-row input[type=color]::-webkit-color-swatch{border:none;border-radius:1px}.controls-list{list-style:none;margin:0;padding:0}.controls-list li{padding:3px 0;font-size:10px;color:#a0a0a0}.controls-list li strong{color:#6a9fd4;margin-right:4px}.panel-actions{display:flex;gap:6px;padding:8px;background:#252525;border-top:1px solid #3d3d3d;border-radius:0 0 3px 3px}.panel-actions button{flex:1;padding:5px 10px;border:1px solid #3d3d3d;border-radius:2px;font-size:11px;cursor:pointer;font-family:inherit;transition:background .1s,border-color .1s}#apply-settings{background:#2d5a2d;color:#a8d4a8;border-color:#3d7a3d}#apply-settings:hover{background:#3a6f3a;border-color:#4a8f4a}#reset-settings{background:#2b2b2b;color:#a0a0a0}#reset-settings:hover{background:#353535;border-color:#5a5a5a}.panel-hint{padding:6px 8px;font-size:10px;color:#6a9fd4;background:#1e1e1e;text-align:left;border-top:1px solid #3d3d3d}details.section{margin:0;padding:0;background:#1e1e1e}