.css-gradient[data-v-0cc7c261]{padding:20px;max-width:900px;margin:0 auto}.tool-card[data-v-0cc7c261]{background:var(--bg-color);border:1px solid var(--border-color);border-radius:12px;padding:24px}.tool-header[data-v-0cc7c261]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.header-actions[data-v-0cc7c261]{display:flex;gap:8px}.gradient-preview[data-v-0cc7c261]{width:100%;height:200px;border-radius:8px;border:1px solid var(--border-color);display:flex;align-items:center;justify-content:center;margin-bottom:12px;position:relative}.preview-label[data-v-0cc7c261]{background:rgba(0,0,0,.3);color:#fff;padding:4px 12px;border-radius:4px;font-size:12px}.css-output[data-v-0cc7c261]{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;padding:12px 16px;margin-bottom:20px;font-family:Consolas,Monaco,monospace;font-size:13px;color:var(--text-color);word-break:break-all;line-height:1.6;cursor:pointer}.css-output[data-v-0cc7c261]:hover{border-color:#2c8cf0}.gradient-config[data-v-0cc7c261]{display:flex;flex-direction:column;gap:20px}.config-section h4[data-v-0cc7c261]{margin:0 0 10px;font-size:14px;color:var(--text-color)}.type-tabs[data-v-0cc7c261]{display:flex;gap:8px;flex-wrap:wrap}.type-tab[data-v-0cc7c261]{padding:6px 16px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-secondary);border-radius:6px;cursor:pointer;font-size:13px;transition:all .2s}.type-tab[data-v-0cc7c261]:hover{border-color:#2c8cf0;color:#2c8cf0}.type-tab.active[data-v-0cc7c261]{background:#2c8cf0;border-color:#2c8cf0;color:#fff}.direction-control[data-v-0cc7c261]{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.angle-dial[data-v-0cc7c261]{width:48px;height:48px;border-radius:50%;border:2px solid var(--border-color);position:relative;display:flex;align-items:center;justify-content:center;flex-shrink:0}.angle-indicator[data-v-0cc7c261]{width:2px;height:18px;background:#2c8cf0;position:absolute;top:6px;left:50%;margin-left:-1px;transform-origin:bottom center;border-radius:1px}.angle-text[data-v-0cc7c261]{font-size:11px;color:var(--text-secondary);position:absolute;bottom:2px}.direction-control input[type=range][data-v-0cc7c261]{flex:1;min-width:120px}.direction-presets[data-v-0cc7c261]{display:flex;gap:4px;flex-wrap:wrap}.dir-btn[data-v-0cc7c261]{width:32px;height:32px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-color);border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s}.dir-btn[data-v-0cc7c261]:hover,.dir-btn.active[data-v-0cc7c261]{background:#2c8cf0;border-color:#2c8cf0;color:#fff}.shape-control[data-v-0cc7c261],.conic-control[data-v-0cc7c261]{display:flex;flex-direction:column;gap:10px}.position-control[data-v-0cc7c261]{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-secondary)}.position-control select[data-v-0cc7c261]{padding:4px 8px;border:1px solid var(--border-color);border-radius:4px;background:var(--bg-secondary);color:var(--text-color);font-size:13px}.conic-control label[data-v-0cc7c261]{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-secondary)}.conic-control input[type=number][data-v-0cc7c261]{width:70px;padding:4px 8px;border:1px solid var(--border-color);border-radius:4px;background:var(--bg-secondary);color:var(--text-color);font-size:13px}.color-stops[data-v-0cc7c261]{display:flex;flex-direction:column;gap:10px}.color-stop-item[data-v-0cc7c261]{display:flex;align-items:center;gap:10px;background:var(--bg-secondary);padding:8px 12px;border-radius:6px}.stop-slider[data-v-0cc7c261]{flex:1;min-width:80px}.stop-pos[data-v-0cc7c261]{font-size:12px;color:var(--text-secondary);min-width:36px;text-align:right}.remove-btn[data-v-0cc7c261]{width:24px;height:24px;border:none;background:transparent;color:#f56c6c;cursor:pointer;font-size:14px;border-radius:4px;transition:background .2s}.remove-btn[data-v-0cc7c261]:hover{background:rgba(245,108,108,.1)}.add-btn[data-v-0cc7c261]{width:100%;padding:8px;border-style:dashed}.preset-section[data-v-0cc7c261]{margin-top:24px;padding-top:20px;border-top:1px solid var(--border-color)}.preset-section h4[data-v-0cc7c261]{margin:0 0 12px;font-size:14px;color:var(--text-color)}.preset-grid[data-v-0cc7c261]{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.preset-item[data-v-0cc7c261]{height:60px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .2s;border:1px solid rgba(0,0,0,.1)}.preset-item[data-v-0cc7c261]:hover{transform:scale(1.05)}.preset-name[data-v-0cc7c261]{font-size:11px;font-weight:600;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.5)}.tool-btn[data-v-0cc7c261]{padding:6px 14px;border:1px solid var(--border-color);background:var(--bg-color);color:var(--text-secondary);border-radius:4px;cursor:pointer;font-size:13px;transition:all .2s}.tool-btn[data-v-0cc7c261]:hover{border-color:#2c8cf0;color:#2c8cf0}@media (max-width: 768px){.direction-control[data-v-0cc7c261]{flex-direction:column;align-items:stretch}.angle-dial[data-v-0cc7c261]{align-self:center}.gradient-preview[data-v-0cc7c261]{height:150px}.preset-grid[data-v-0cc7c261]{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}}