.page-module__2hMfYa__content{gap:24px;margin-bottom:32px;display:flex}.page-module__2hMfYa__previewPanel{flex-shrink:0;width:320px}.page-module__2hMfYa__controlsPanel{flex-direction:column;flex:1;gap:16px;display:flex}.page-module__2hMfYa__panel{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}.page-module__2hMfYa__panelHeader{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.page-module__2hMfYa__panelTitle{color:var(--text-secondary);font-size:.875rem;font-weight:600}.page-module__2hMfYa__panelActions{gap:8px;display:flex}.page-module__2hMfYa__panelBody{padding:16px}.page-module__2hMfYa__actionBtn{background:var(--background);border:1px solid var(--border);width:32px;height:32px;color:var(--text-muted);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;transition:all .2s;display:flex}.page-module__2hMfYa__actionBtn:hover{color:var(--primary);border-color:var(--primary)}.page-module__2hMfYa__previewBody{padding:20px}.page-module__2hMfYa__previewArea{border-radius:12px;width:100%;height:280px;transition:background .3s;box-shadow:0 4px 16px #0000001f}.page-module__2hMfYa__formGroup{margin-bottom:16px}.page-module__2hMfYa__formGroup:last-child{margin-bottom:0}.page-module__2hMfYa__formGroup label{color:var(--text-secondary);margin-bottom:8px;font-size:.875rem;font-weight:500;display:block}.page-module__2hMfYa__typeButtons{gap:8px;display:flex}.page-module__2hMfYa__typeBtn{background:var(--background);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:8px;flex:1;padding:10px 16px;font-family:inherit;font-size:.875rem;transition:all .2s}.page-module__2hMfYa__typeBtn:hover{border-color:var(--primary)}.page-module__2hMfYa__typeBtn.page-module__2hMfYa__active{background:var(--primary);border-color:var(--primary);color:#fff}.page-module__2hMfYa__rangeInput{appearance:none;background:var(--border);cursor:pointer;border-radius:3px;width:100%;height:6px}.page-module__2hMfYa__rangeInput::-webkit-slider-thumb{appearance:none;background:var(--primary);cursor:pointer;border-radius:50%;width:16px;height:16px}.page-module__2hMfYa__rangeInput::-moz-range-thumb{background:var(--primary);cursor:pointer;border:none;border-radius:50%;width:16px;height:16px}.page-module__2hMfYa__anglePresets{gap:4px;margin-top:8px;display:flex}.page-module__2hMfYa__anglePresetBtn{background:var(--background);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:4px;padding:4px 8px;font-family:inherit;font-size:.75rem}.page-module__2hMfYa__anglePresetBtn:hover{border-color:var(--text-muted)}.page-module__2hMfYa__anglePresetBtn.page-module__2hMfYa__active{background:var(--primary);border-color:var(--primary);color:#fff}.page-module__2hMfYa__addBtn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;align-items:center;gap:4px;padding:6px 12px;font-family:inherit;font-size:.75rem;transition:background .2s;display:flex}.page-module__2hMfYa__addBtn:hover{background:var(--primary-dark)}.page-module__2hMfYa__colorStops{flex-direction:column;gap:12px;display:flex}.page-module__2hMfYa__colorStop{background:var(--background);border-radius:8px;align-items:center;gap:12px;padding:12px;display:flex}.page-module__2hMfYa__colorInputWrap{align-items:center;gap:8px;display:flex}.page-module__2hMfYa__colorInput{border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;width:32px;height:32px;padding:2px}.page-module__2hMfYa__colorHexInput{border:1px solid var(--border);background:var(--surface);width:80px;color:var(--text-primary);border-radius:4px;padding:6px 10px;font-family:SF Mono,Consolas,monospace;font-size:.8rem}.page-module__2hMfYa__colorHexInput:focus{border-color:var(--primary);outline:none}.page-module__2hMfYa__positionInput{flex:1;align-items:center;gap:8px;display:flex}.page-module__2hMfYa__positionValue{width:40px;color:var(--text-secondary);text-align:right;font-size:.75rem;font-weight:500}.page-module__2hMfYa__removeBtn{border:1px solid var(--border);width:28px;height:28px;color:var(--text-muted);cursor:pointer;background:0 0;border-radius:4px;justify-content:center;align-items:center;transition:all .2s;display:flex}.page-module__2hMfYa__removeBtn:hover{color:#ef4444;border-color:#ef4444}.page-module__2hMfYa__presets{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.page-module__2hMfYa__presetItem{border:1px solid var(--border);cursor:pointer;border-radius:8px;width:100%;height:48px;transition:transform .2s}.page-module__2hMfYa__presetItem:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.page-module__2hMfYa__codeBlock{background:var(--background);color:var(--text-primary);word-break:break-all;border-radius:8px;padding:12px 16px;font-family:SF Mono,Consolas,monospace;font-size:.8rem;line-height:1.6;overflow-x:auto}.page-module__2hMfYa__codeBlock code{color:var(--text-primary)}.page-module__2hMfYa__copyBtn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:12px;padding:10px 16px;font-family:inherit;font-size:.875rem;font-weight:500;transition:background .2s;display:flex}.page-module__2hMfYa__copyBtn:hover{background:var(--primary-dark)}@media (max-width:768px){.page-module__2hMfYa__content{flex-direction:column}.page-module__2hMfYa__previewPanel{order:-1;width:100%}.page-module__2hMfYa__previewArea{height:200px}.page-module__2hMfYa__colorStop{flex-wrap:wrap}.page-module__2hMfYa__positionInput{order:1;width:100%;margin-top:8px}.page-module__2hMfYa__presets{grid-template-columns:repeat(2,1fr)}}