.cpg-tool{background:#fff;border-radius:16px;border:1px solid var(--gray-200);padding:2rem;margin-top:2rem}.cpg-controls{display:flex;gap:1.5rem;flex-wrap:wrap;align-items:flex-end;margin-bottom:2rem}.cpg-control-group{display:flex;flex-direction:column;gap:.35rem}.cpg-control-btn{justify-content:flex-end}.cpg-label{font-size:.875rem;font-weight:600;color:var(--gray-600)}.cpg-color-input-row{display:flex;align-items:center;gap:.5rem}.cpg-color-picker,.cpg-hex-input{border:1px solid var(--gray-300);border-radius:8px}.cpg-color-picker{width:48px;height:40px;padding:2px;cursor:pointer;background:#fff}.cpg-hex-input{width:100px;padding:.45rem .65rem;font-size:.875rem;font-family:"Courier New",monospace;color:var(--gray-800)}.cpg-hex-input:focus,.cpg-select:focus{outline:0;border-color:var(--primary-500)}.cpg-select{padding:.45rem .75rem;border:1px solid var(--gray-300);border-radius:8px;font-size:.875rem;color:var(--gray-800);background:#fff;cursor:pointer;min-width:180px}.cpg-palette{display:flex;gap:1rem;flex-wrap:wrap}.cpg-swatch{display:flex;flex-direction:column;border-radius:12px;overflow:hidden;border:1px solid var(--gray-200);min-width:130px;flex:1}.cpg-swatch-color{height:100px;width:100%}.cpg-swatch-info{padding:.75rem;background:#fff;display:flex;flex-direction:column;gap:.2rem}.cpg-swatch-hex{font-size:.875rem;font-weight:700;font-family:"Courier New",monospace;color:var(--gray-800)}.cpg-swatch-values{font-size:.75rem;color:var(--gray-500);font-family:"Courier New",monospace}.cpg-swatch-copy{margin-top:.5rem;padding:.3rem .6rem;font-size:.75rem;border:1px solid var(--gray-300);border-radius:6px;background:#fff;cursor:pointer;color:var(--gray-600);transition:background .15s}.cpg-swatch-copy:hover{background:var(--gray-100)}