.cc-input-row{display:flex;gap:10px;align-items:stretch}.cc-input-row .form-input{flex:1;min-width:0}.cc-picker{width:46px;height:46px;padding:2px;border:1px solid var(--border-input);border-radius:8px;background:var(--field);cursor:pointer;flex-shrink:0}.cc-picker::-webkit-color-swatch-wrapper{padding:2px}.cc-picker::-webkit-color-swatch{border:0;border-radius:4px}.cc-picker::-moz-color-swatch{border:0;border-radius:4px}.cc-quick-colors{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.cc-quick-btn{width:28px;height:28px;border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:transform var(--transition);padding:0}.cc-quick-btn:hover{transform:scale(1.15)}.cc-quick-btn>.tooltip{transform:translateX(-50%) translateY(4px) scale(.87)}.cc-quick-btn:focus-visible>.tooltip,.cc-quick-btn:hover>.tooltip{transform:translateX(-50%) translateY(0) scale(.87)}.cc-quick-btn-light{border-color:var(--border-input)}.cc-preview{display:none;gap:10px;margin-bottom:14px}.cc-preview.is-visible{display:flex}.cc-preview-box{flex:1;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-radius:9px;border:1px solid var(--border);min-height:56px}.cc-on-white{background:#fff}.cc-on-black{background:#000}.cc-preview-sample{font-size:28px;font-weight:700;line-height:1}.cc-preview-badge{font-family:var(--font-mono);font-size:11px;font-weight:600;padding:3px 7px;border-radius:4px;white-space:nowrap}.cc-badge-aaa{background:#166534;color:#fff}.cc-badge-aa{background:#15803d;color:#fff}.cc-badge-aa-large{background:#a16207;color:#fff}.cc-badge-fail{background:#991b1b;color:#fff}.cc-outputs{display:flex;flex-direction:column;gap:8px}.cc-outputs .input-group-label{width:90px;flex-shrink:0}.cc-outputs .input-group-field{cursor:copy}.cc-outputs .input-group.is-copied{border-color:var(--dot-client);transition:border-color .2s}.cc-palette-section{margin-top:var(--panel-gap, 16px)}select.cc-harmony-select{width:auto;min-width:160px;height:32px;font-size:12px;padding:0 26px 0 10px;margin-left:auto;background-position:right 8px center}.cc-palette{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}.cc-palette-card{background:var(--field);border:1px solid var(--border);border-radius:9px;overflow:hidden;cursor:pointer;transition:transform var(--transition)}.cc-palette-card:hover{transform:translateY(-2px)}.cc-palette-swatch{height:56px}.cc-palette-info{padding:8px 10px;font-family:var(--font-mono);font-size:12px;color:var(--text-2)}@media (max-width:600px){.cc-preview{flex-direction:column}.cc-outputs .input-group-label{width:70px;font-size:11px}.cc-palette{grid-template-columns:repeat(auto-fit,minmax(100px,1fr))}}