.cpgen-input-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}.cpgen-input-row input[type=color]{width:48px;height:48px;padding:2px;border:1px solid var(--border);border-radius:var(--r);background:var(--bg3);cursor:pointer}.mono{font-family:JetBrains Mono,monospace;width:120px}.opt-input{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:var(--r);font-size:13px;outline:none}.opt-input:focus{border-color:var(--accent)}.opt-select{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:var(--r);font-size:13px;outline:none;cursor:pointer;min-width:180px}.opt-label{font-size:11px;color:var(--muted);text-transform:uppercase;font-weight:600;display:flex;align-items:center;gap:8px}.cpgen-swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:10px}.cpgen-swatch{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;cursor:pointer;transition:transform .2s}.cpgen-swatch:hover{transform:translateY(-3px)}.cpgen-swatch-color{height:60px}.cpgen-swatch-hex{padding:8px;text-align:center;font-family:JetBrains Mono,monospace;font-size:11px;color:#fff;font-weight:600}.cpgen-actions{display:flex;gap:8px;flex-wrap:wrap}.cpgen-ui-preview{border:1px solid var(--border);border-radius:var(--r);overflow:hidden}.ui-header{padding:14px 20px;font-weight:700;font-size:15px}.ui-body{padding:20px}.ui-card{border-radius:var(--r);padding:16px;display:flex;flex-direction:column;gap:10px}.ui-card-title{font-weight:700;font-size:14px}.ui-card-text{font-size:13px;opacity:.8}.ui-btn{border:none;padding:8px 20px;border-radius:var(--r);font-weight:600;font-size:13px;cursor:pointer;align-self:flex-start}.ui-bg-sample{padding:14px 20px;font-size:12px;text-align:center;font-weight:600}.cpgen-favs{display:flex;flex-direction:column;gap:12px}.empty-favs{color:var(--muted);font-size:13px;text-align:center;padding:20px}.cpgen-fav-item{background:var(--bg3);border:1px solid var(--border);border-radius:var(--r);padding:12px;display:flex;align-items:center;gap:12px}.cpgen-fav-stripes{display:flex;height:36px;border-radius:4px;overflow:hidden;flex:1}.cpgen-fav-stripe{flex:1}.cpgen-fav-info{font-size:11px;color:var(--muted);white-space:nowrap}.cpgen-fav-del{background:transparent;border:none;color:var(--error);cursor:pointer;font-size:16px;padding:4px}.form-container{display:flex;flex-direction:column;gap:16px}