.palette-generator-container{max-width:1320px}.palette-generator-workspace{padding-top:1rem}.palette-generator-panel{position:relative;padding:0;overflow:hidden;overflow:clip;border:0;background:#171717;box-shadow:0 16px 48px #0000006b}.palette-generator-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(400px,2fr);align-items:start;background:linear-gradient(90deg,#202020 60%,#151515 60%)}.palette-generator-stage,.palette-generator-inspector{min-width:0;padding:clamp(1.25rem,2.6vw,2rem)}.palette-generator-stage{position:sticky;top:0;background:#202020}.palette-generator-inspector{border-inline-start:1px solid rgba(255,255,255,.09);background:#151515}.palette-generator-section-heading,.palette-generator-subheading,.palette-generator-save-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.palette-generator-section-heading{margin-bottom:1rem}.palette-generator-section-heading h2,.palette-generator-section-heading h3,.palette-generator-subheading h3,.palette-generator-save-heading h3{min-width:0;margin:0;color:#fff;font-family:var(--font-montserrat-semi-bold);letter-spacing:-.02em;overflow-wrap:anywhere}.palette-generator-section-heading h2{font-size:clamp(1rem,2vw,1.5rem)}.palette-generator-section-heading h3,.palette-generator-subheading h3,.palette-generator-save-heading h3{font-size:1rem}.palette-generator-subheading{align-items:center;margin-bottom:.75rem}.palette-generator-subheading>span{min-width:0;flex:0 1 auto;padding:.35rem .5rem;border:1px solid rgba(255,177,90,.28);border-radius:8px;background:#ff8c4214;color:#ffffffd1;font-size:var(--font-size-s);line-height:1.2;overflow-wrap:anywhere}.palette-generator-panel button,.palette-generator-panel a,.palette-generator-panel input,.palette-generator-panel select{min-height:44px}.palette-generator-panel .tool-btn,.palette-generator-panel .tool-btn-secondary,.palette-generator-panel .tool-btn-icon{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:44px;white-space:normal;text-align:center}.palette-generator-panel .tool-btn{color:#000}.palette-generator-panel .tool-btn:hover{background:linear-gradient(90deg,#f5a33f,#e41802);color:#000}.palette-generator-panel .tool-btn:disabled,.palette-generator-panel .tool-btn-secondary:disabled,.palette-generator-panel .tool-btn-icon:disabled,.palette-generator-clear-saved:disabled{cursor:not-allowed;opacity:.48;transform:none}.palette-generator-panel .tool-input:focus,.palette-generator-panel .tool-select:focus,.palette-generator-panel input[type=color]:focus-visible,.palette-generator-panel input[type=radio]:focus-visible,.palette-generator-panel button:focus-visible,.palette-generator-panel a:focus-visible,.palette-generator-panel textarea:focus-visible{outline:2px solid #ffb15a;outline-offset:3px}.palette-generator-panel .tool-input[aria-invalid=true]{border-color:#fa1801}.palette-generator-form{margin:0}.palette-generator-base-row{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:end;gap:.75rem}.palette-generator-native-control,.palette-generator-base-control,.palette-generator-options>label{min-width:0;margin:0}.palette-generator-native-control>span,.palette-generator-base-control>span,.palette-generator-options>label>span{display:block;margin-bottom:.45rem;color:#ffffffc9;font-family:var(--font-montserrat-semi-bold);font-size:.875rem;line-height:1.3}.palette-generator-native-control input[type=color]{display:block;width:100%;height:44px;padding:4px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:#0d0d0d;cursor:pointer}.palette-generator-native-control input[type=color]::-webkit-color-swatch-wrapper{padding:0}.palette-generator-native-control input[type=color]::-webkit-color-swatch,.palette-generator-native-control input[type=color]::-moz-color-swatch{border:0;border-radius:8px}.palette-generator-base-control .tool-input{width:100%;min-width:0;border-color:#ffffff26;background:#0d0d0d;font-family:var(--font-monospace);font-size:.875rem}.palette-generator-base-control .tool-input::placeholder{color:#ffffffa8}.palette-generator-hint,.palette-generator-last-valid,.palette-generator-result-note,.palette-generator-preview-limitation,.palette-generator-save-heading p{color:#ffffffb3;font-size:.875rem;line-height:1.5}.palette-generator-hint{margin:.55rem 0 0}.palette-generator-last-valid{margin:.55rem 0 0;color:#ffb15a}.palette-generator-error{min-height:0;margin-top:.55rem}.palette-generator-panel .palette-generator-error,.palette-generator-panel .palette-generator-action-error{color:#ffb4ab}.palette-generator-error.visible{margin-bottom:0}.palette-generator-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(112px,.46fr) auto;align-items:end;gap:.75rem;margin-top:1rem}.palette-generator-options .tool-select{width:100%;border-color:#ffffff26;background:#0d0d0d}.palette-generator-generate{min-width:168px}.palette-generator-notice{display:flex;align-items:flex-start;gap:.55rem;margin:1rem 0 0;padding:.75rem;border:1px solid rgba(255,177,90,.36);border-radius:8px;background:#2a2a2a;color:#ffffffef;font-size:.875rem;line-height:1.5}.palette-generator-notice[hidden]{display:none}.palette-generator-notice i{flex:0 0 auto;margin-top:.2rem;color:#ffb15a}.palette-generator-results{margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid rgba(255,255,255,.1)}.palette-generator-results-heading{align-items:baseline}.palette-generator-result-note{max-width:34ch;margin:0;text-align:end}.palette-generator-swatch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:.55rem;margin:0;padding:0;list-style:none}.palette-generator-swatch-item{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#151515}.palette-generator-swatch-use{display:flex;width:100%;min-width:0;min-height:118px;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:.7rem;border:0;border-radius:0;background:var(--swatch-color);color:var(--swatch-text);cursor:pointer;text-align:start}.palette-generator-swatch-use:hover{box-shadow:inset 0 0 0 2px currentColor}.palette-generator-panel .palette-generator-swatch-use:focus-visible{outline-color:currentColor;outline-offset:-3px}.palette-generator-panel .palette-generator-swatch-copy:focus-visible{outline-offset:-3px}.palette-generator-swatch-use>span{font-family:var(--font-montserrat-semi-bold);font-size:var(--font-size-s);line-height:1.2}.palette-generator-swatch-use code{max-width:100%;color:inherit;font-family:var(--font-monospace);font-size:var(--font-size-s);font-weight:600;line-height:1.25;overflow-wrap:anywhere}.palette-generator-swatch-guidance{display:grid;gap:.3rem;min-height:66px;padding:.6rem;color:#ffffffbd;font-size:var(--font-size-s);line-height:1.35}.palette-generator-swatch-guidance>span{min-width:0}.palette-generator-swatch-guidance code,.palette-generator-swatch-guidance strong{color:#fff;font-family:var(--font-monospace);font-size:inherit;overflow-wrap:anywhere}.palette-generator-swatch-copy{display:inline-flex;width:100%;min-height:44px;align-items:center;justify-content:center;gap:.38rem;padding:.55rem;border:0;border-top:1px solid rgba(255,255,255,.1);border-radius:0;background:#202020;color:#ffffffd6;font-family:var(--font-montserrat-semi-bold);font-size:var(--font-size-s);cursor:pointer}.palette-generator-swatch-copy:hover{background:#2a2a2a;color:#ffb15a}.palette-generator-swatch-copy i{width:1em;text-align:center}.palette-generator-swatch-copy.is-copied{color:#b9f3cd}.palette-generator-preview-section,.palette-generator-output-section,.palette-generator-save-section{margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,.1)}.palette-generator-preview-section{margin-top:0;padding-top:0;border-top:0}.palette-generator-preview{overflow:hidden;border:1px solid var(--preview-border);border-radius:12px;background:var(--preview-surface);color:var(--preview-text)}.palette-generator-preview-bar{display:flex;min-height:48px;align-items:center;justify-content:space-between;gap:.75rem;padding:.65rem .75rem;border-bottom:1px solid var(--preview-border);color:inherit;font-family:var(--font-montserrat-semi-bold);font-size:var(--font-size-s);line-height:1.2}.palette-generator-preview-status{display:inline-flex;min-height:30px;align-items:center;padding:.35rem .5rem;border-radius:8px;background:var(--preview-status);color:var(--preview-on-status)}.palette-generator-preview-body{padding:clamp(1rem,3vw,1.4rem)}.palette-generator-preview-body h4{max-width:18ch;margin:0;color:inherit;font-family:var(--font-montserrat-bold);font-size:clamp(1.5rem,3vw,1.75rem);line-height:1.15;letter-spacing:-.03em}.palette-generator-preview-body p{max-width:48ch;margin:.75rem 0 1.1rem;color:inherit;font-size:.875rem;line-height:1.55}.palette-generator-preview-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.palette-generator-preview-actions>span{display:inline-flex;min-height:44px;min-width:0;align-items:center;justify-content:center;padding:.6rem;border:1px solid var(--preview-border);border-radius:8px;font-family:var(--font-montserrat-semi-bold);font-size:var(--font-size-s);line-height:1.25;text-align:center;overflow-wrap:anywhere}.palette-generator-preview-actions>span:first-child{background:var(--preview-secondary);color:var(--preview-on-secondary)}.palette-generator-preview-actions>span:last-child{background:var(--preview-primary);color:var(--preview-on-primary)}.palette-generator-preview-limitation{margin:.7rem 0 0}.palette-generator-format-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;min-width:0;margin:0;padding:0;border:0}.palette-generator-format-group legend{width:auto;margin:0 0 .55rem;padding:0;color:#ffffffc7;font-family:var(--font-montserrat-semi-bold);font-size:.875rem;line-height:1.3}.palette-generator-format-group label{position:relative;min-width:0;margin:0;cursor:pointer}.palette-generator-format-group input{position:absolute;width:1px;height:1px;margin:-1px;opacity:0}.palette-generator-format-group label>span{display:flex;min-height:44px;align-items:center;justify-content:center;padding:.55rem;border:1px solid rgba(255,255,255,.15);border-radius:8px;background:#202020;color:#ffffffc7;font-family:var(--font-montserrat-semi-bold);font-size:var(--font-size-s);line-height:1.25;text-align:center}.palette-generator-format-group input:checked+span{border-color:#ffb15ab8;background:#ff8c4224;color:#fff}.palette-generator-format-group input:focus-visible+span{outline:2px solid #ffb15a;outline-offset:3px}.palette-generator-output{display:block;width:100%;min-height:246px;margin-top:.7rem;padding:.85rem;resize:vertical;border:1px solid rgba(255,255,255,.14);border-radius:10px;background:#0d0d0d;color:#f1f1f1;font-family:var(--font-monospace);font-size:var(--font-size-s);line-height:1.55;-moz-tab-size:2;tab-size:2;white-space:pre}.palette-generator-output-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.65rem}.palette-generator-output-actions .tool-btn,.palette-generator-output-actions .tool-btn-secondary{flex:1 1 auto;min-width:0;padding-inline:.55rem;font-size:var(--font-size-s)}.palette-generator-save-heading p{max-width:54ch;margin:.35rem 0 0}.palette-generator-save-heading .tool-btn-secondary{flex:0 0 auto}.palette-generator-saved-controls{display:flex;min-height:44px;align-items:center;gap:.55rem;margin-top:.75rem;padding:.65rem .75rem;border-radius:10px;background:#202020}.palette-generator-no-saved{min-width:0;flex:1 1 auto;color:#ffffffb8;font-size:var(--font-size-s);line-height:1.4}.palette-generator-saved-controls .tool-btn-secondary,.palette-generator-clear-saved{flex:0 0 auto;min-height:44px;font-size:var(--font-size-s)}.palette-generator-clear-saved{padding:.45rem .2rem;border:0;background:transparent;color:#ffb15a;font-family:var(--font-montserrat-semi-bold);cursor:pointer;text-decoration:underline;text-underline-offset:.22em}.palette-generator-clear-saved:hover{color:#fff}.palette-generator-status{min-height:44px;margin-top:.8rem;padding:.68rem .75rem;border:1px solid transparent;border-radius:8px;background:#202020;color:#ffffffc9;font-size:.875rem;line-height:1.5}.palette-generator-action-error{min-height:0;margin-top:.8rem}.palette-generator-action-error.visible{margin-bottom:0}.palette-generator-status[data-state=success]{border-color:#3f93608c;background:#3f93602b;color:#b9f3cd}.palette-generator-status[data-state=error]{border-color:#fa1801;background:#2a2a2a;color:#ffffffef}.palette-generator-status[data-state=warning]{border-color:#ffb15a;background:#2a2a2a;color:#ffffffef}.palette-generator-context-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1rem;margin-top:1.2rem;padding:1rem;border-radius:12px;background:linear-gradient(120deg,#ff8c4233,#ffc14b14)}.palette-generator-context-cta[hidden]{display:none}.palette-generator-context-cta h3{margin:0 0 .35rem;color:#fff;font-family:var(--font-montserrat-semi-bold);font-size:1rem}.palette-generator-context-cta p{max-width:52ch;margin:0;color:#ffffffc2;font-size:.875rem;line-height:1.5}.palette-generator-context-actions{display:flex;min-width:180px;flex-direction:column;gap:.5rem}.palette-generator-context-actions .tool-btn,.palette-generator-context-actions .tool-btn-secondary{text-decoration:none}.palette-generator-panel.is-resolving .palette-generator-swatch-grid{animation:palette-generator-resolve .36s cubic-bezier(.16,1,.3,1)}@keyframes palette-generator-resolve{0%{filter:saturate(.68);clip-path:inset(0 100% 0 0 round 12px);transform:translateY(3px)}to{filter:saturate(1);clip-path:inset(0 0 0 0 round 12px);transform:translateY(0)}}.palette-generator-guide .container{max-width:930px}.palette-generator-steps{margin:0 0 2rem;padding-inline-start:1.35rem}.palette-generator-steps li{margin-bottom:.65rem;color:#ffffffc7;line-height:1.65}.palette-generator-cta-actions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1rem;margin-top:1.35rem}.palette-generator-cta-actions .primary-button{background:linear-gradient(90deg,#faaa47,#fa1801);color:#000;text-decoration:none}.palette-generator-cta-actions .primary-button:hover{background:linear-gradient(90deg,#f5a33f,#e41802);color:#000}.palette-generator-phoenix-cta a:focus-visible{outline:2px solid #ffb15a;outline-offset:3px}.palette-generator-cta-actions .tool-text-link{display:inline-flex;min-height:44px;align-items:center;justify-content:center;color:#ffb15a;font-family:var(--font-montserrat-semi-bold);text-decoration:underline;text-underline-offset:.24em}@media (max-width: 1080px){.palette-generator-layout{grid-template-columns:minmax(0,1fr)}.palette-generator-stage{position:static}.palette-generator-layout{background:none}.palette-generator-inspector{border-block-start:1px solid rgba(255,255,255,.09);border-inline-start:0}.palette-generator-swatch-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 760px){.palette-generator-stage,.palette-generator-inspector{padding:1.15rem}.palette-generator-options{grid-template-columns:repeat(2,minmax(0,1fr))}.palette-generator-generate{grid-column:1 / -1;width:100%}.palette-generator-save-heading{align-items:stretch;flex-direction:column}.palette-generator-save-heading .tool-btn-secondary{width:100%}.palette-generator-saved-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.palette-generator-no-saved{grid-column:1 / -1}.palette-generator-context-cta{grid-template-columns:minmax(0,1fr)}.palette-generator-context-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0}}@media (max-width: 560px){.palette-generator-section-heading,.palette-generator-subheading{align-items:stretch;flex-direction:column}.palette-generator-results-heading{gap:.45rem}.palette-generator-section-heading .tool-btn-icon{width:100%;max-width:100%}.palette-generator-result-note{max-width:none;text-align:start}.palette-generator-base-row{grid-template-columns:76px minmax(0,1fr)}.palette-generator-swatch-grid{grid-template-columns:minmax(0,1fr)}.palette-generator-swatch-item{display:grid;grid-template-columns:minmax(96px,.9fr) minmax(0,1.4fr) auto;align-items:stretch}.palette-generator-swatch-use{min-height:72px;height:100%;gap:.35rem;padding:.6rem}.palette-generator-swatch-guidance{min-height:0;align-content:center}.palette-generator-swatch-copy{width:auto;height:100%;min-width:44px;padding-inline:.75rem;border-top:0;border-inline-start:1px solid rgba(255,255,255,.1)}.palette-generator-format-group{grid-template-columns:minmax(0,1fr)}.palette-generator-output{min-height:220px}.palette-generator-preview-actions,.palette-generator-saved-controls,.palette-generator-context-actions{grid-template-columns:minmax(0,1fr)}.palette-generator-cta-actions{align-items:stretch;flex-direction:column}.palette-generator-cta-actions a{width:100%;text-align:center}}@media (max-width: 380px){.palette-generator-stage,.palette-generator-inspector{padding-inline:.9rem}.palette-generator-base-row,.palette-generator-options{grid-template-columns:minmax(0,1fr)}.palette-generator-native-control input[type=color]{width:76px}.palette-generator-generate{grid-column:auto}.palette-generator-swatch-grid{gap:.45rem}.palette-generator-preview-bar{align-items:flex-start;flex-direction:column}}@media (prefers-reduced-motion: reduce){.palette-generator-workspace *,.palette-generator-workspace *:before,.palette-generator-workspace *:after,.palette-generator-phoenix-cta *,.palette-generator-phoenix-cta *:before,.palette-generator-phoenix-cta *:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.palette-generator-panel .tool-btn:hover,.palette-generator-phoenix-cta .primary-button:hover{transform:none}}@media (forced-colors: active){.palette-generator-panel,.palette-generator-swatch-item,.palette-generator-preview,.palette-generator-format-group label>span,.palette-generator-output,.palette-generator-saved-controls,.palette-generator-status,.palette-generator-context-cta{border:1px solid CanvasText;forced-color-adjust:auto}.palette-generator-swatch-use,.palette-generator-preview,.palette-generator-preview-status,.palette-generator-preview-actions>span,.palette-generator-native-control input[type=color]{forced-color-adjust:none}.palette-generator-swatch-use,.palette-generator-preview,.palette-generator-preview-status,.palette-generator-preview-actions>span{outline:1px solid #ffffff;outline-offset:-1px}.palette-generator-format-group input:checked+span{background:Highlight;color:HighlightText}}