.page-module__nA-ztq__main{padding:32px 0}.page-module__nA-ztq__content{gap:24px;margin-bottom:32px;display:flex}.page-module__nA-ztq__previewPanel{flex-shrink:0;width:320px}.page-module__nA-ztq__controlsPanel{flex-direction:column;flex:1;gap:16px;display:flex}.page-module__nA-ztq__panel{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}.page-module__nA-ztq__panelHeader{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.page-module__nA-ztq__panelTitle{color:var(--text-secondary);font-size:.875rem;font-weight:600}.page-module__nA-ztq__panelActions{gap:8px;display:flex}.page-module__nA-ztq__panelBody{padding:16px}.page-module__nA-ztq__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__nA-ztq__actionBtn:hover{color:var(--primary);border-color:var(--primary)}.page-module__nA-ztq__previewBody{padding:20px}.page-module__nA-ztq__previewArea{border-radius:12px;width:100%;height:280px;transition:background .3s;box-shadow:0 4px 16px #0000001f}.page-module__nA-ztq__formGroup{margin-bottom:16px}.page-module__nA-ztq__formGroup:last-child{margin-bottom:0}.page-module__nA-ztq__formGroup label{color:var(--text-secondary);margin-bottom:8px;font-size:.875rem;font-weight:500;display:block}.page-module__nA-ztq__typeButtons{gap:8px;display:flex}.page-module__nA-ztq__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__nA-ztq__typeBtn:hover{border-color:var(--primary)}.page-module__nA-ztq__typeBtn.page-module__nA-ztq__active{background:var(--primary);border-color:var(--primary);color:#fff}.page-module__nA-ztq__rangeInput{appearance:none;background:var(--border);cursor:pointer;border-radius:3px;width:100%;height:6px}.page-module__nA-ztq__rangeInput::-webkit-slider-thumb{appearance:none;background:var(--primary);cursor:pointer;border-radius:50%;width:16px;height:16px}.page-module__nA-ztq__rangeInput::-moz-range-thumb{background:var(--primary);cursor:pointer;border:none;border-radius:50%;width:16px;height:16px}.page-module__nA-ztq__anglePresets{gap:4px;margin-top:8px;display:flex}.page-module__nA-ztq__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__nA-ztq__anglePresetBtn:hover{border-color:var(--text-muted)}.page-module__nA-ztq__anglePresetBtn.page-module__nA-ztq__active{background:var(--primary);border-color:var(--primary);color:#fff}.page-module__nA-ztq__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__nA-ztq__addBtn:hover{background:var(--primary-dark)}.page-module__nA-ztq__colorStops{flex-direction:column;gap:12px;display:flex}.page-module__nA-ztq__colorStop{background:var(--background);border-radius:8px;align-items:center;gap:12px;padding:12px;display:flex}.page-module__nA-ztq__colorInputWrap{align-items:center;gap:8px;display:flex}.page-module__nA-ztq__colorInput{border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;width:32px;height:32px;padding:2px}.page-module__nA-ztq__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__nA-ztq__colorHexInput:focus{border-color:var(--primary);outline:none}.page-module__nA-ztq__positionInput{flex:1;align-items:center;gap:8px;display:flex}.page-module__nA-ztq__positionValue{width:40px;color:var(--text-secondary);text-align:right;font-size:.75rem;font-weight:500}.page-module__nA-ztq__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__nA-ztq__removeBtn:hover{color:#ef4444;border-color:#ef4444}.page-module__nA-ztq__presets{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.page-module__nA-ztq__presetItem{border:1px solid var(--border);cursor:pointer;border-radius:8px;width:100%;height:48px;transition:transform .2s}.page-module__nA-ztq__presetItem:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.page-module__nA-ztq__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__nA-ztq__codeBlock code{color:var(--text-primary)}.page-module__nA-ztq__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__nA-ztq__copyBtn:hover{background:var(--primary-dark)}.page-module__nA-ztq__relatedToolsCompact{margin-top:32px;padding-bottom:0}@media (max-width:768px){.page-module__nA-ztq__content{flex-direction:column}.page-module__nA-ztq__previewPanel{order:-1;width:100%}.page-module__nA-ztq__previewArea{height:200px}.page-module__nA-ztq__colorStop{flex-wrap:wrap}.page-module__nA-ztq__positionInput{order:1;width:100%;margin-top:8px}.page-module__nA-ztq__presets{grid-template-columns:repeat(2,1fr)}}