.control-group{display:flex;flex-direction:column;gap:8px}.control-group label{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}select,input[type=number]{background:var(--bg3);border:1px solid var(--border);color:#fff;padding:10px 12px;border-radius:var(--r);outline:none;font-family:JetBrains Mono,monospace;font-size:14px;transition:border-color .2s}select:focus,input:focus{border-color:var(--accent)}select{cursor:pointer}.direction-row{display:flex;gap:8px}.direction-row select{flex:1}.direction-row input{width:80px}.stops-container{display:flex;flex-direction:column;gap:8px;max-height:240px;overflow-y:auto}.stop-row{display:flex;gap:8px;align-items:center;padding:8px;background:var(--bg3);border-radius:var(--r);border:1px solid var(--border)}.stop-row input[type=color]{width:40px;height:40px;border:1px solid var(--border);border-radius:6px;cursor:pointer;background:none;padding:2px}.stop-row input[type=number]{width:60px}.stop-row .stop-label{font-family:JetBrains Mono,monospace;font-size:11px;color:var(--muted);min-width:60px}.stop-row .btn-ghost{background:transparent;border:none;color:#f85149;cursor:pointer;font-size:16px;padding:4px 8px}.presets-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px}.preset-btn{height:48px;border-radius:var(--r);border:1px solid var(--border);cursor:pointer;font-size:10px;font-weight:700;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.5);text-transform:uppercase;transition:transform .2s,border-color .2s}.preset-btn:hover{transform:scale(1.05);border-color:#fff}.preset-sunset{background:linear-gradient(135deg,#ff6b6b,#feca57)}.preset-ocean{background:linear-gradient(135deg,#00b894,#0984e3)}.preset-forest{background:linear-gradient(135deg,#00b894,#6c5ce7)}.preset-neon{background:linear-gradient(135deg,#fd79a8,#a29bfe)}.preset-pastel{background:linear-gradient(135deg,#fab1a0,#81ecec)}.gradient-preview{width:100%;height:300px;border-radius:var(--r);border:1px solid var(--border);transition:background .2s}@media(max-width:768px){.gradient-preview{height:200px}}.css-code{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:16px;font-family:JetBrains Mono,monospace;font-size:12px;color:#fff;white-space:pre-wrap;word-break:break-all;min-height:80px}.btn-sm{padding:5px 12px;font-size:12px}.hidden{display:none}