.tool-color-palettes *,.tool-color-palettes *::before,.tool-color-palettes *::after{box-sizing:border-box}.tool-color-palettes{--cpal-line: var(--color-gray-light-medium, #e2e4ea);--cpal-muted: var(--color-gray-medium, #888);--cpal-panel: var(--color-white, #fff);--cpal-soft: var(--color-gray-lighter, #f6f7f9);--cpal-inset: #f4f5f8;--cpal-accent: var(--color-purple, #5632a0);--cpal-danger: #b3261e;--cpal-radius: 14px;--cpal-shadow: 0 12px 34px rgba(var(--color-dark-rgb, 18 20 29), .07);--cpal-mono: "SF Mono", "Fira Code", "JetBrains Mono", ui-monospace, monospace;display:flex;flex-direction:column;gap:20px;color:var(--color-dark, #12141d)}.tool-color-palettes .cpal{display:flex;flex-direction:column;gap:20px}.tool-color-palettes .cpal-section{padding:22px;border:1px solid var(--cpal-line);border-radius:var(--cpal-radius);background-color:var(--cpal-panel);box-shadow:var(--cpal-shadow)}.tool-color-palettes .cpal-section__head{margin-bottom:18px}.tool-color-palettes .cpal-section__title{margin:0 0 4px;font-size:19px;font-weight:700;line-height:1.2}.tool-color-palettes .cpal-section__lead{margin:0;max-width:720px;font-size:14px;line-height:1.5;color:var(--cpal-muted)}.tool-color-palettes .cpal-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:42px;padding:0 18px;border:1px solid var(--cpal-line);border-radius:10px;background-color:var(--cpal-panel);color:var(--color-dark, #12141d);font-size:14px;font-weight:600;line-height:1;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease,box-shadow .15s ease}.tool-color-palettes .cpal-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tool-color-palettes .cpal-btn:hover{border-color:rgba(var(--color-purple-rgb), 0.5);color:var(--cpal-accent)}.tool-color-palettes .cpal-btn:focus-visible{outline:2px solid var(--cpal-accent);outline-offset:2px}.tool-color-palettes .cpal-btn--primary{border-color:var(--cpal-accent);background-color:var(--cpal-accent);color:var(--color-white, #fff)}.tool-color-palettes .cpal-btn--primary:hover{background-color:color-mix(in srgb, var(--cpal-accent) 88%, #000);border-color:rgba(0,0,0,0);color:var(--color-white, #fff)}.tool-color-palettes .cpal-btn--primary.is-done{background-color:#1f9254;border-color:#1f9254}.tool-color-palettes .cpal-search__controls{display:grid;grid-template-columns:minmax(0, 1fr) auto;gap:10px}.tool-color-palettes .cpal-search__field{position:relative;display:flex;align-items:center}.tool-color-palettes .cpal-search__field svg{position:absolute;left:14px;width:18px;height:18px;fill:none;stroke:var(--cpal-muted);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}.tool-color-palettes .cpal-search__field input{width:100%;height:44px;padding:0 16px 0 42px;border:1px solid var(--cpal-line);border-radius:10px;background-color:var(--cpal-panel);color:var(--color-dark, #12141d);font-size:15px}.tool-color-palettes .cpal-search__field input::-moz-placeholder{color:var(--cpal-muted)}.tool-color-palettes .cpal-search__field input::placeholder{color:var(--cpal-muted)}.tool-color-palettes .cpal-search__field input:focus{outline:none;border-color:var(--cpal-accent);box-shadow:0 0 0 3px rgba(var(--color-purple-rgb), 0.12)}.tool-color-palettes .cpal-search__note{margin:10px 0 0;font-size:12px;color:var(--cpal-muted)}.tool-color-palettes .cpal-cards{display:grid;grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));gap:14px}.tool-color-palettes .cpal-cards:empty{display:none}.tool-color-palettes .cpal-search-results,.tool-color-palettes .cpal-generated{margin-top:16px}.tool-color-palettes .cpal-card{display:flex;flex-direction:column;gap:12px;padding:12px;border:1px solid var(--cpal-line);border-radius:12px;background-color:var(--cpal-panel);cursor:pointer;text-align:left;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.tool-color-palettes .cpal-card:hover{border-color:rgba(var(--color-purple-rgb), 0.55);transform:translateY(-2px)}.tool-color-palettes .cpal-card:focus-visible{outline:2px solid var(--cpal-accent);outline-offset:2px}.tool-color-palettes .cpal-card.is-active{border-color:var(--cpal-accent);box-shadow:0 0 0 2px rgba(var(--color-purple-rgb), 0.35)}.tool-color-palettes .cpal-card__preview{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;overflow:hidden;height:54px;border-radius:8px;border:1px solid rgba(var(--color-dark-rgb, 18 20 29), 0.08)}.tool-color-palettes .cpal-card__preview span{display:block;height:100%}.tool-color-palettes .cpal-card__meta{display:flex;flex-direction:column;gap:3px}.tool-color-palettes .cpal-card__meta strong{font-size:14px;color:var(--color-dark, #12141d)}.tool-color-palettes .cpal-card__meta span,.tool-color-palettes .cpal-card__meta em{font-size:12px;font-style:normal;line-height:1.4;color:var(--cpal-muted)}.tool-color-palettes .cpal-card__meta em{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.tool-color-palettes .cpal-status{grid-column:1/-1;margin:0;font-size:14px;color:var(--cpal-muted)}.tool-color-palettes .cpal-status.is-error{color:var(--cpal-danger)}.tool-color-palettes .cpal-generator__controls{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px}.tool-color-palettes .cpal-seed{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:600;color:var(--cpal-muted)}.tool-color-palettes .cpal-seed__row{display:flex;align-items:center;gap:8px}.tool-color-palettes .cpal-seed__row input[type=text]{width:104px;height:42px;padding:0 12px;border:1px solid var(--cpal-line);border-radius:10px;background-color:var(--cpal-panel);font-family:var(--cpal-mono);font-size:13px;text-transform:uppercase;color:var(--color-dark, #12141d)}.tool-color-palettes .cpal-seed__row input[type=text]:focus{outline:none;border-color:var(--cpal-accent);box-shadow:0 0 0 3px rgba(var(--color-purple-rgb), 0.12)}.tool-color-palettes .cpal-generator__actions{display:flex;flex-wrap:wrap;gap:10px;margin-left:auto}.tool-color-palettes input[type=color]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:42px;height:42px;padding:0;border:1px solid rgba(var(--color-dark-rgb, 18 20 29), 0.18);border-radius:10px;background:none;cursor:pointer}.tool-color-palettes input[type=color]::-webkit-color-swatch-wrapper{padding:3px}.tool-color-palettes input[type=color]::-webkit-color-swatch{border:none;border-radius:7px}.tool-color-palettes input[type=color]::-moz-color-swatch{border:none;border-radius:7px}.tool-color-palettes input[type=color]:focus-visible{outline:2px solid var(--cpal-accent);outline-offset:2px}.tool-color-palettes .cpal-editor__grid{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);gap:22px;align-items:start}.tool-color-palettes .cpal-editor__fields{display:flex;flex-direction:column;gap:10px}.tool-color-palettes .cpal-current{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;overflow:hidden;height:64px;margin-bottom:6px;border-radius:10px;border:1px solid rgba(var(--color-dark-rgb, 18 20 29), 0.08)}.tool-color-palettes .cpal-current span{display:block;height:100%}.tool-color-palettes .cpal-field{display:grid;grid-template-columns:42px minmax(0, 1fr) auto;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--cpal-line);border-radius:10px;background-color:var(--cpal-soft)}.tool-color-palettes .cpal-field.has-invalid{border-color:var(--cpal-danger);box-shadow:0 0 0 1px var(--cpal-danger)}.tool-color-palettes .cpal-field__content{display:flex;flex-direction:column;gap:2px;min-width:0}.tool-color-palettes .cpal-field__label{font-size:14px;font-weight:600}.tool-color-palettes .cpal-field__desc{font-size:12px;line-height:1.35;color:var(--cpal-muted)}.tool-color-palettes .cpal-field__hex{width:96px;height:40px;padding:0 10px;border:1px solid var(--cpal-line);border-radius:8px;background-color:var(--cpal-panel);font-family:var(--cpal-mono);font-size:13px;text-transform:uppercase;color:var(--color-dark, #12141d)}.tool-color-palettes .cpal-field__hex:focus{outline:none;border-color:var(--cpal-accent);box-shadow:0 0 0 3px rgba(var(--color-purple-rgb), 0.12)}.tool-color-palettes .cpal-preview{overflow:hidden;border:1px solid var(--cpal-line);border-radius:12px;background-color:var(--cpal-c-background, #f8f9fa);--cpal-c-primary: #228be6;--cpal-c-secondary: #7950f2;--cpal-c-accent: #12b886;--cpal-c-neutral: #495057;--cpal-c-neutral-rgb: 73 80 87;--cpal-c-background: #f8f9fa;--cpal-c-surface: #ffffff}.tool-color-palettes .cpal-preview__bar{display:flex;align-items:center;gap:7px;padding:10px 14px;border-bottom:1px solid rgba(var(--color-dark-rgb, 18 20 29), 0.08);background-color:var(--cpal-c-surface, #fff)}.tool-color-palettes .cpal-preview__dot{width:10px;height:10px;border-radius:50%;background-color:rgba(var(--cpal-c-neutral-rgb, 73 80 87), 0.25)}.tool-color-palettes .cpal-preview__bar-label{margin-left:6px;font-size:12px;font-weight:600;color:rgba(var(--cpal-c-neutral-rgb, 73 80 87), 0.7)}.tool-color-palettes .cpal-preview__body{padding:22px;background-color:var(--cpal-c-background, #f8f9fa)}.tool-color-palettes .cpal-preview__card{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:22px;border-radius:12px;border:1px solid rgba(var(--cpal-c-neutral-rgb, 73 80 87), 0.12);background-color:var(--cpal-c-surface, #fff);box-shadow:0 10px 26px rgba(var(--cpal-c-neutral-rgb, 73 80 87), 0.12)}.tool-color-palettes .cpal-preview__badge,.tool-color-palettes .cpal-preview__pill{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background-color:var(--cpal-c-accent, #12b886);color:#fff;font-size:11px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}.tool-color-palettes .cpal-preview__title{margin:0;font-size:20px;font-weight:700;line-height:1.2;color:var(--cpal-c-neutral, #495057)}.tool-color-palettes .cpal-preview__text{margin:0;font-size:14px;line-height:1.5;color:rgba(var(--cpal-c-neutral-rgb, 73 80 87), 0.78)}.tool-color-palettes .cpal-preview__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:2px}.tool-color-palettes .cpal-preview__btn{height:40px;padding:0 18px;border-radius:9px;border:1px solid rgba(0,0,0,0);font-size:13px;font-weight:600;cursor:pointer}.tool-color-palettes .cpal-preview__btn--primary{background-color:var(--cpal-c-primary, #228be6);color:#fff}.tool-color-palettes .cpal-preview__btn--secondary{background-color:rgba(0,0,0,0);border-color:var(--cpal-c-secondary, #7950f2);color:var(--cpal-c-secondary, #7950f2)}.tool-color-palettes .cpal-preview__row{display:flex;align-items:center;gap:14px;margin-top:2px}.tool-color-palettes .cpal-preview__link{font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;color:var(--cpal-c-primary, #228be6)}.tool-color-palettes .cpal-export__toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.tool-color-palettes .cpal-segmented{display:inline-flex;padding:3px;border:1px solid var(--cpal-line);border-radius:10px;background-color:var(--cpal-soft)}.tool-color-palettes .cpal-seg-btn{padding:7px 14px;border:none;border-radius:7px;background:none;font-size:13px;font-weight:600;color:var(--cpal-muted);cursor:pointer;transition:background-color .15s ease,color .15s ease}.tool-color-palettes .cpal-seg-btn:hover{color:var(--color-dark, #12141d)}.tool-color-palettes .cpal-seg-btn.is-active{background-color:var(--cpal-panel);color:var(--cpal-accent);box-shadow:0 1px 3px rgba(var(--color-dark-rgb, 18 20 29), 0.12)}.tool-color-palettes .cpal-export__actions{display:flex;gap:10px}.tool-color-palettes .cpal-code{margin:0;max-height:320px;overflow:auto;padding:18px;border:1px solid var(--cpal-line);border-radius:10px;background-color:var(--cpal-inset);font-family:var(--cpal-mono);font-size:13px;line-height:1.6;color:var(--color-dark, #12141d);white-space:pre;-moz-tab-size:2;-o-tab-size:2;tab-size:2}.tool-color-palettes .cpal-code:focus-visible{outline:2px solid var(--cpal-accent);outline-offset:2px}@media(max-width: 1024px){.tool-color-palettes .cpal-editor__grid{grid-template-columns:1fr}}@media(max-width: 640px){.tool-color-palettes .cpal-section{padding:18px}.tool-color-palettes .cpal-search__controls{grid-template-columns:1fr}.tool-color-palettes .cpal-generator__actions{margin-left:0;width:100%}.tool-color-palettes .cpal-generator__actions .cpal-btn{flex:1 1 auto}.tool-color-palettes .cpal-field{grid-template-columns:42px minmax(0, 1fr);grid-template-areas:"picker content" "hex hex";row-gap:10px}.tool-color-palettes .cpal-field__picker{grid-area:picker}.tool-color-palettes .cpal-field__content{grid-area:content}.tool-color-palettes .cpal-field__hex{grid-area:hex;width:100%}.tool-color-palettes .cpal-export__toolbar{flex-direction:column;align-items:stretch}.tool-color-palettes .cpal-segmented{justify-content:space-between}.tool-color-palettes .cpal-export__actions .cpal-btn{flex:1 1 auto}}