:root{--bg-color:#ededf9;--surface-color:#fff;--purple:#484884;--sticky-purple:#d8d7ee;--light-blue:#e3f2fd;--light-purple:#ededf9;--light-green:#e9f6d5;--light-yellow:#ffefcc;--light-red:#fce6e2;--light-gray:#e0e0e0;--text-color:#1f2937;--muted-text-color:#374151;--soft-text-color:#555;--subtle-surface-color:#f7f7fb;--code-bg-color:#1f2937;--section-width:1280px;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:4rem;--padding-card:1.75rem;--padding-button:10px 15px;--padding-badge:5px 13px 5px 10px;--compare-mode-offset:15px;--border-radius:.5rem;--border-radius-secondary:.25rem;--border-radius-pill:2rem;--border-width:1px;--border-default:var(--border-width) solid var(--light-gray);--outline-selected:2px solid var(--purple);--color-preview-size:50px;--compare-preview-height:100px;--contrast-text-size:4rem;--icon-size:1rem;--preview-text-24:24px;--preview-text-19:19px;--preview-text-16:16px;--preview-text-14:14px;--font-weight-regular:400;--font-weight-medium:500;--font-weight-bold:700;--motion-fast:.14s;--motion-medium:.22s;--motion-slow:.36s;--motion-ease:cubic-bezier(.22, 1, .36, 1)}:root[data-theme=dark]{--bg-color:#151426;--surface-color:#211f35;--purple:#a7a4e6;--sticky-purple:#2a2943;--light-blue:#1d3148;--light-purple:#2f2d4a;--light-green:#253d2a;--light-yellow:#473719;--light-red:#4a2828;--light-gray:#4a4864;--text-color:#f4f3fb;--muted-text-color:#d8d7ee;--soft-text-color:#b9b7d2;--subtle-surface-color:#2a2840;--code-bg-color:#141321}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:130px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@keyframes page-rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}body{background-color:var(--bg-color);color:var(--text-color);transition:background-color var(--motion-medium) var(--motion-ease), color var(--motion-medium) var(--motion-ease);margin:0;font-family:Schibsted Grotesk,sans-serif}#root{flex-direction:column;min-height:100vh;display:flex}body.modal-open{overflow:hidden}.logo{font-size:2rem;font-weight:600}.navigation-container{background-color:var(--purple);color:var(--surface-color);padding:0}.navigation-content{width:100%;max-width:var(--section-width);padding:var(--space-xl);justify-content:space-between;align-items:center;margin:0 auto;display:flex}.logo-container{cursor:pointer;transition:transform var(--motion-fast) var(--motion-ease);background-color:#0000;border:none;align-items:center;padding:0;display:flex}.logo-container:hover{transform:translateY(-1px)}.logo-container:focus-visible{outline:2px solid var(--surface-color);outline-offset:6px}.logo-svg{width:auto;height:28px;display:block}.navigation-anchor-items{align-items:center;gap:var(--space-lg);display:flex}.theme-toggle-button{border-radius:var(--border-radius-secondary);width:38px;min-height:38px;color:var(--surface-color);cursor:pointer;background-color:#0000;border:1px solid #ffffff47;justify-content:center;align-items:center;display:inline-flex}.theme-toggle-button:hover,.theme-toggle-button[aria-pressed=true]{background-color:#ffffff24}.theme-toggle-button:focus-visible{outline-offset:2px;outline:2px solid #ffffffe6}.theme-toggle-button .material-symbols-outlined{font-size:1.1rem}.route-tabs{border-radius:var(--border-radius-pill);background-color:#ffffff24;padding:4px;display:inline-flex}.route-tab{border-radius:var(--border-radius-pill);color:#ffffffe6;min-height:36px;font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;white-space:nowrap;transition:background-color var(--motion-fast) var(--motion-ease), color var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease), transform var(--motion-fast) var(--motion-ease);background-color:#0000;border:none;padding:0 12px}.route-tab:hover{background-color:#ffffff1f}.route-tab:focus-visible{outline-offset:2px;outline:2px solid #ffffffe6}.route-tab-active{background-color:var(--surface-color);color:var(--purple)}.route-tabs-nav{background-color:#0000;padding:0}.route-tabs-nav .route-tab{border-radius:var(--border-radius-secondary);color:var(--surface-color);background-color:#0000;border:1px solid #ffffff47}.route-tabs-nav .route-tab:hover{background-color:#ffffff24}.route-tabs-nav .route-tab-active{background-color:var(--surface-color);color:var(--purple)}.route-tabs-nav .route-tab-active:hover{background-color:var(--surface-color);color:var(--purple);transform:none}.tool-switcher-shell{z-index:9999999;border-bottom:var(--border-default);background-color:color-mix(in srgb, var(--sticky-purple) 94%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:sticky;top:0}.tool-switcher-content{max-width:var(--section-width);padding:var(--space-sm) var(--space-xl);margin:0 auto}.tool-switcher{background-color:var(--surface-color);border:var(--border-default);border-radius:var(--border-radius-secondary)}.tool-switcher .route-tab{border-radius:var(--border-radius-secondary);color:#374151}.tool-switcher .route-tab:hover{background-color:var(--light-purple);color:var(--purple);transform:translateY(-1px)}.tool-switcher .route-tab-active{background-color:var(--purple);color:var(--surface-color)}.card-heading{margin-top:0}.panel-heading-row{align-items:center;gap:var(--space-xs);display:flex}.panel-heading-row .card-heading{margin-bottom:0}.panel-help{display:inline-flex;position:relative}.panel-help-button{border-radius:var(--border-radius-pill);width:26px;height:26px;color:var(--purple);cursor:pointer;background-color:#0000;border:none;justify-content:center;align-items:center;display:inline-flex}.panel-help-active .panel-help-button,.panel-help-button:focus-visible{background-color:var(--light-purple)}.panel-help-button:focus-visible{outline:var(--outline-selected);outline-offset:2px}.panel-help-button .material-symbols-outlined{font-size:1rem}.panel-help-popover{z-index:40;left:0;top:calc(100% + var(--space-xs));border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);width:min(280px,100vw - 32px);padding:var(--space-md);border-color:#5e5aa359;display:none;position:absolute;box-shadow:0 16px 34px #11182729}.panel-help-active .panel-help-popover{gap:var(--space-xs);animation:page-rise var(--motion-medium) var(--motion-ease);display:grid}.panel-help-popover-header{justify-content:space-between;align-items:flex-start;gap:var(--space-sm);display:flex}.panel-help-popover strong{color:#1f2937}.panel-help-popover>span:not(.panel-help-popover-header){color:#374151;font-size:.9rem;line-height:1.45}.panel-help-link{width:fit-content;color:var(--purple);font:inherit;font-size:.9rem;font-weight:var(--font-weight-bold);text-underline-offset:3px;cursor:pointer;margin-top:var(--space-md);background-color:#0000;border:none;padding:0;text-decoration:underline}.panel-help-link:hover{text-decoration:none}.panel-help-close{border-radius:var(--border-radius-pill);width:24px;height:24px;color:var(--purple);cursor:pointer;background-color:#0000;border:none;justify-content:center;align-items:center;display:none}.panel-help-active .panel-help-close{display:inline-flex}.panel-help-close:hover{background-color:var(--light-purple)}.panel-help-close .material-symbols-outlined{font-size:.95rem}.section-width{max-width:var(--section-width);padding:0 var(--space-xl);flex:1 0 auto;margin:0 auto}.content{gap:var(--space-lg);flex-direction:column;padding-top:0;padding-bottom:clamp(50px,10vw,70px);display:flex}button,summary,input{transition:background-color var(--motion-fast) var(--motion-ease), border-color var(--motion-fast) var(--motion-ease), color var(--motion-fast) var(--motion-ease), opacity var(--motion-fast) var(--motion-ease), transform var(--motion-fast) var(--motion-ease)}.color-palette-container,.compare-color-container,.compare-color-text-container,.preview-section,.palette-compare-section,.scale-generator-panel,.scale-css-preview,.tool-guide-index,.tool-guide-card,.faq-item,.selected-color-body,.color-preview-container,.palette-result-cell,.palette-mobile-pair,.scale-swatch-tile{transition:background-color var(--motion-medium) var(--motion-ease), border-color var(--motion-medium) var(--motion-ease), color var(--motion-medium) var(--motion-ease), opacity var(--motion-medium) var(--motion-ease), transform var(--motion-medium) var(--motion-ease)}@media (hover:hover){.tool-guide-card:hover,.faq-item:hover,.scale-swatch-tile:hover,.palette-mobile-pair:hover{transform:translateY(-2px)}}.contrast-checker-section{gap:var(--space-lg);flex-direction:column;display:flex}.contrast-checker-section .top-grid,.scale-generator-page .scale-page-layout,.faq-page .tool-guide-index,.faq-page .tool-guide-list,.faq-page>.tool-guide-section{animation:page-rise var(--motion-slow) var(--motion-ease) 70ms both}.faq-page .tool-guide-list{animation-delay:.11s}.faq-page>.tool-guide-section{animation-delay:.15s}.intro-section{gap:var(--space-lg);grid-template-columns:1fr 1fr;padding:clamp(50px,10vw,70px) 0;display:grid}.intro-section h1,.intro-section p{margin:0}.intro-section h1{max-width:720px;margin-bottom:var(--space-md);font-size:2.5rem;line-height:1.1}.intro-section p{line-height:1.7}.info-popover-container{width:fit-content;margin-top:var(--space-md);position:relative}.info-icon-button{border:var(--border-default);background-color:var(--surface-color);color:#374151;font:inherit;cursor:pointer;justify-content:center;align-items:center;gap:var(--space-xs);border-radius:var(--border-radius-secondary);min-height:30px;font-size:.9rem;font-weight:var(--font-weight-bold);background-color:#0000;border-color:#0000;padding:0;transition:background-color .15s,border-color .15s,transform .15s;display:inline-flex}.info-icon-button:hover,.info-icon-button-active{color:var(--purple)}.info-icon-button .material-symbols-outlined{font-size:1rem}.info-icon-button span:last-child{text-underline-offset:3px;text-decoration:underline}.info-icon-button:hover span:last-child{text-decoration:none}.info-icon-button:focus-visible{outline:var(--outline-selected);outline-offset:3px}.intro-section p:last-child{color:#374151;max-width:700px;line-height:1.7}.github-button{align-items:center;gap:var(--space-sm);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);min-height:44px;color:var(--surface-color);padding:0 var(--space-lg);font-weight:var(--font-weight-bold);border-color:#0000;text-decoration:none;transition:background-color .15s,transform .15s,box-shadow .15s;display:inline-flex}.github-button:focus-visible{outline:var(--outline-selected);outline-offset:3px}.footer-github-button{color:var(--surface-color);border-color:#0000}.intro-eyebrow{margin-bottom:var(--space-md);color:#555;font-size:.82rem;font-weight:var(--font-weight-regular);text-transform:uppercase}.intro-thresholds{gap:var(--space-md);grid-template-columns:repeat(3,minmax(92px,1fr));display:grid}.intro-thresholds div{gap:var(--space-sm);min-width:128px;padding:var(--space-lg);border:var(--border-default);border-radius:var(--border-radius);background-color:#fafafa;display:grid}.intro-thresholds strong{font-size:1.35rem}.intro-thresholds span{color:#555;font-size:.82rem;line-height:1.3}.top-grid{align-items:stretch;gap:var(--space-lg);grid-template-columns:1fr 1fr;display:grid}.top-grid-palette{grid-template-columns:1fr 1fr}.contrast-seo-summary{align-items:start;gap:var(--space-lg);margin-bottom:var(--space-lg);border:var(--border-default);border-color:var(--summary-border-color,var(--purple));border-radius:var(--border-radius);background-color:var(--summary-bg-color,var(--surface-color));padding:var(--padding-card);grid-column:1/-1;grid-template-columns:minmax(0,1fr) auto;display:grid}.contrast-seo-summary-pass{--summary-bg-color:#e6f1df;--summary-border-color:#5f9f69}.contrast-seo-summary-warn{--summary-bg-color:#f4ebd9;--summary-border-color:#c89a3f}.contrast-seo-summary-fail{--summary-bg-color:#f4dfdc;--summary-border-color:#c95f5f}.contrast-seo-summary>div{max-width:calc((100% + (var(--padding-card) * 2) - var(--space-lg)) / 2);grid-area:1/1/span 2}.contrast-seo-summary h2,.contrast-seo-summary p{margin:0}.contrast-seo-summary h2{margin-bottom:var(--space-md);font-size:1.2rem}.contrast-seo-summary p{color:#374151;line-height:1.6}.contrast-summary-actions{align-content:space-between;place-self:stretch end;justify-items:end;gap:var(--space-sm);grid-area:1/2/span 2;display:grid}.contrast-add-pair-button{justify-content:center;align-items:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);min-height:34px;color:var(--purple);padding:0 var(--space-md);font:inherit;font-size:.9rem;font-weight:var(--font-weight-bold);cursor:pointer;white-space:nowrap;border-color:#5e5aa347;display:inline-flex}.contrast-add-pair-button:hover:not(:disabled){border-color:var(--purple);background-color:#deddf5}.contrast-add-pair-button:disabled{cursor:not-allowed;opacity:.58}.contrast-add-pair-button .material-symbols-outlined{font-size:1rem}.contrast-summary-dismiss{border:var(--border-default);border-radius:var(--border-radius-pill);background-color:var(--surface-color);width:34px;height:34px;color:var(--purple);cursor:pointer;border-color:#5e5aa347;flex:none;justify-content:center;align-items:center;display:inline-flex}.contrast-summary-dismiss:hover{border-color:var(--purple);background-color:#deddf5}.contrast-summary-dismiss .material-symbols-outlined{font-size:1rem}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.color-palette-section{background-color:var(--surface-color);padding:var(--padding-card);border-radius:var(--border-radius);border:var(--border-width) solid #5e5aa37a;transition:box-shadow .18s,border-color .18s;box-shadow:0 0 0 3px #5e5aa31f}.scale-generator-panel{margin-top:var(--space-lg);border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);padding:var(--padding-card)}.scale-page-layout{gap:var(--space-lg);flex-direction:column;display:flex}.scale-page-top-row{gap:var(--space-lg);grid-template-columns:1fr 1fr;align-items:start;display:grid}.scale-page-top-empty{min-width:0}.scale-page-scale-row{width:100%}.scale-generator-header{align-items:flex-start;gap:var(--space-lg);margin-bottom:var(--space-lg);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid}.scale-generator-header>div:first-child{grid-template-columns:minmax(0,1fr);display:grid}.scale-generator-header .panel-heading-row,.scale-generator-subtitle{grid-column:1}.scale-generator-header .card-heading{font-weight:var(--font-weight-bold)}.scale-action-button{align-items:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);min-height:38px;padding:0 var(--space-md);color:inherit;font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;white-space:nowrap;flex:none;display:inline-flex}.scale-action-button:hover{border-color:var(--purple);background-color:var(--light-purple)}.scale-action-button:disabled{cursor:not-allowed;opacity:.45}.scale-generator-subtitle{margin:var(--space-xs) 0 0;color:#374151;line-height:1.5}.scale-steps-control{justify-items:end;gap:var(--space-xs);font-size:.82rem;font-weight:var(--font-weight-bold);color:#374151;white-space:nowrap;display:grid}.scale-steps-control input[type=range]{width:180px}.scale-steps-value{font-variant-numeric:tabular-nums;justify-content:flex-end;min-width:28px;display:inline-flex}.scale-swatch-grid{gap:var(--space-sm);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));display:grid}.scale-swatch-tile{align-items:center;gap:var(--space-sm);border:var(--border-width) solid transparent;border-color:var(--purple);border-radius:var(--border-radius-secondary);cursor:pointer;min-height:44px;font:inherit;text-align:left;grid-template-columns:1fr auto auto;padding:10px 12px;transition:border-color .15s,transform .15s;display:grid}.scale-swatch-tile:hover{transform:translateY(-1px)}.scale-panel-switch{width:fit-content;margin-top:var(--space-xl);border-radius:var(--border-radius-secondary);gap:var(--space-sm);background-color:#5e5aa31f;padding:4px;display:inline-flex}.scale-panel-switch-button{align-items:center;gap:var(--space-xs);border-radius:var(--border-radius-secondary);color:#374151;min-height:34px;padding:0 var(--space-md);font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;white-space:nowrap;background-color:#0000;border:none;display:inline-flex}.scale-panel-switch-button:hover{background-color:#ffffffb3}.scale-panel-switch-button:focus-visible{outline:var(--outline-selected);outline-offset:2px}.scale-panel-switch-button-active{background-color:var(--surface-color);color:var(--purple);box-shadow:0 0 0 1px #5e5aa32e}.scale-panel-switch-button .material-symbols-outlined{font-size:1rem}.scale-css-preview{gap:var(--space-md);margin-top:var(--space-sm);border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);padding:var(--space-lg);display:grid}.scale-css-preview-header{justify-content:space-between;align-items:flex-start;gap:var(--space-lg);display:flex}.scale-css-preview-header .card-heading{margin-bottom:var(--space-xs);font-weight:var(--font-weight-bold)}.scale-css-preview-header p:last-child{color:#374151;margin:0;line-height:1.5}.scale-css-controls{gap:var(--space-sm);flex-wrap:wrap;justify-content:flex-end;display:inline-flex}.scale-css-format-selector{border-radius:var(--border-radius-secondary);gap:var(--space-sm);background-color:#5e5aa31f;padding:4px;display:inline-flex}.scale-css-format-option{border-radius:var(--border-radius-secondary);color:#374151;min-height:30px;font:inherit;font-size:.82rem;font-weight:var(--font-weight-bold);cursor:pointer;background-color:#0000;border:none;padding:0 10px}.scale-css-format-option:hover{background-color:#ffffffb3}.scale-css-format-option:focus-visible{outline:var(--outline-selected);outline-offset:2px}.scale-css-format-option-active{background-color:var(--surface-color);color:var(--purple);box-shadow:0 0 0 1px #5e5aa32e}.scale-code-window{border:var(--border-width) solid #5e5aa32e;border-radius:var(--border-radius-secondary);background-color:#1f2937;overflow:hidden}.scale-code-copy-button{justify-content:flex-end;align-items:center;gap:var(--space-xs);color:#f9fafb;width:100%;min-height:38px;padding:0 var(--space-md);font:inherit;font-size:.85rem;font-weight:var(--font-weight-bold);cursor:pointer;background-color:#ffffff0f;border:none;border-bottom:1px solid #f9fafb1f;display:flex}.scale-code-copy-button:hover{background-color:#ffffff1f}.scale-code-copy-button:focus-visible{outline-offset:-3px;outline:2px solid #f9fafb}.scale-code-copy-button .material-symbols-outlined{font-size:1rem}.scale-css-code{color:#f9fafb;padding:var(--space-md);background-color:#0000;border:none;margin:0;font-size:.9rem;line-height:1.6;overflow-x:auto}.scale-css-code code{white-space:pre;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.faq-page{gap:var(--space-lg);flex-direction:column;display:flex}.tool-guide-index,.tool-guide-card{border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color)}.tool-guide-card,#common-questions{scroll-margin-top:140px}.tool-guide-index{gap:var(--space-md);padding:var(--padding-card);margin-bottom:var(--space-xl);display:grid}.tool-guide-index>div:first-child{gap:var(--space-xs);display:grid}.tool-guide-index .card-heading,.tool-guide-card .card-heading{margin-bottom:var(--space-xs);font-weight:var(--font-weight-bold)}.tool-guide-index p:last-child,.tool-guide-card p{color:#1f2937;margin-top:0;line-height:1.6}.tool-guide-link-groups{gap:var(--space-lg);grid-template-columns:repeat(auto-fit,minmax(180px,1fr));display:grid}.tool-guide-link-group{align-content:start;gap:var(--space-sm);padding-left:var(--space-md);border-left:2px solid #5e5aa338;display:grid}.tool-guide-link-group p{width:fit-content;color:var(--purple);font-size:.86rem;font-weight:var(--font-weight-bold);letter-spacing:.02em;text-transform:uppercase;margin:0}.tool-guide-links{gap:var(--space-xs);display:grid}.tool-guide-links a{align-items:center;gap:var(--space-sm);border-radius:var(--border-radius-secondary);color:#1f2937;cursor:pointer;background-color:#0000;border:1px solid #0000;grid-template-columns:auto 1fr;min-height:34px;padding:6px 8px;text-decoration:none;display:grid}.tool-guide-links a:hover{background-color:var(--light-purple);color:var(--purple);border-color:#5e5aa338}.tool-guide-links a span{border-radius:var(--border-radius-secondary);width:30px;height:24px;color:var(--purple);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.78rem;font-weight:var(--font-weight-bold);background-color:#5e5aa31f;justify-content:center;align-items:center;display:inline-flex}.tool-guide-links a strong{font-size:.9rem}.tool-guide-list{gap:var(--space-lg);margin-bottom:var(--space-xl);display:grid}.tool-guide-section{margin-top:var(--space-xl);gap:var(--space-md);display:grid}.tool-guide-section-heading{padding-bottom:var(--space-sm);border-bottom:1px solid #5e5aa36b}.tool-guide-section-heading .card-heading{color:var(--purple);font-size:1.15rem;font-weight:var(--font-weight-bold);margin-bottom:0}.tool-guide-section-cards{gap:var(--space-lg);display:grid}.tool-guide-card{gap:var(--space-lg);padding:var(--padding-card);grid-template-columns:minmax(0,1fr) minmax(260px,.48fr);align-items:start;display:grid}.tool-guide-card-heading{align-items:center;gap:var(--space-sm);display:flex}.tool-guide-card-heading span{color:var(--purple);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1rem;font-weight:var(--font-weight-bold);flex:none}.tool-visual{align-self:start}.tool-guide-details{margin-top:var(--space-md);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:#f4f3fb}.tool-guide-details summary{justify-content:space-between;align-items:center;gap:var(--space-md);min-height:44px;padding:0 var(--space-md);color:var(--purple);font-weight:var(--font-weight-bold);cursor:pointer;display:flex}.tool-guide-details summary:after{content:"+";font-size:1.15rem;line-height:1}.tool-guide-details[open] summary:after{content:"-"}.tool-guide-details summary::-webkit-details-marker{display:none}.tool-guide-details p{padding:0 var(--space-md) var(--space-md);margin:0}.tool-guide-details ul{gap:var(--space-sm);padding:0 var(--space-md) var(--space-md) calc(var(--space-md) + 1.1rem);color:#1f2937;margin:0;line-height:1.5;list-style:none;display:grid}.tool-guide-details li{padding-left:.95rem;position:relative}.tool-guide-details li:before{background-color:var(--purple);content:"";opacity:1;border-radius:3px;width:8px;height:8px;position:absolute;top:.72em;left:0;transform:translateY(-50%)}.tool-visual{border:var(--border-default);border-radius:var(--border-radius);min-height:180px;padding:var(--space-lg);background-color:#f4f3fb}.tool-visual-palette,.tool-visual-scale{gap:var(--space-sm);grid-template-columns:repeat(4,1fr);display:grid}.tool-visual-scale{grid-template-columns:repeat(5,1fr)}.tool-visual-palette span,.tool-visual-scale span{border:var(--border-default);border-radius:var(--border-radius-secondary);min-height:120px}.tool-visual-selected,.tool-visual-manual,.tool-visual-inspect{gap:var(--space-sm);grid-template-columns:1fr 1fr;align-items:stretch;display:grid}.tool-visual-selected-card,.tool-visual-meter{align-content:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);padding:var(--space-md);display:grid}.tool-visual-selected-card span,.tool-visual-meter span{color:#374151;font-size:.82rem;font-weight:var(--font-weight-bold)}.tool-visual-selected-card strong,.tool-visual-meter strong{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.tool-visual-preview{border-radius:var(--border-radius-secondary);background-color:var(--purple);color:var(--surface-color);font-size:4rem;font-weight:var(--font-weight-bold);place-items:center;display:grid}.tool-visual-matrix{gap:var(--space-xs);grid-template-columns:repeat(4,1fr);display:grid}.tool-visual-inspect-preview{align-content:center;gap:var(--space-xs);border-radius:var(--border-radius-secondary);background-color:var(--purple);color:var(--surface-color);padding:var(--space-md);display:grid}.tool-visual-inspect-preview strong{font-size:3rem}.tool-visual-inspect-preview span{color:inherit;font-weight:var(--font-weight-bold)}.tool-visual-inspect-map{grid-template-columns:repeat(6,1fr);gap:3px;display:grid}.tool-visual-inspect-map span{aspect-ratio:1;border:var(--border-default);border-radius:3px;place-items:center;font-family:Material Symbols Outlined;font-size:.78rem;display:grid}.tool-visual-current{outline:3px solid var(--purple);outline-offset:1px}.tool-visual-matrix span{border-radius:var(--border-radius-secondary);border:2px solid #0000}.tool-visual-pass{color:#153a18;background-color:#c7e8a4;border-color:#256029!important}.tool-visual-fail{color:#5f160f;background-color:#f1b7ad;border-color:#9f2a1d!important}.tool-visual-code{align-items:center;display:grid}.tool-visual-code pre{border-radius:var(--border-radius-secondary);color:#f9fafb;padding:var(--space-md);background-color:#1f2937;margin:0;line-height:1.6;overflow-x:auto}.tool-visual-code code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.faq-intro-section{padding-bottom:0}.faq-layout{gap:var(--space-lg);margin-top:var(--space-lg);grid-template-columns:minmax(260px,.42fr) minmax(0,1fr);align-items:start;display:grid}.faq-layout-compact{gap:var(--space-md);grid-template-columns:minmax(0,1fr)}.faq-summary-panel,.faq-item{border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color)}.faq-section-intro{padding:0 var(--space-xs);gap:6px;display:grid}.faq-section-intro .tool-guide-card-heading{margin:0}.faq-section-intro p:last-child{color:#1f2937;margin:0;line-height:1.6}.faq-summary-panel{padding:var(--padding-card)}.faq-layout-compact .faq-summary-panel{padding:var(--space-lg)}.faq-summary-panel .card-heading{margin-bottom:var(--space-sm);font-weight:var(--font-weight-bold)}.faq-summary-panel p:last-child{color:#1f2937;margin:0;line-height:1.6}.faq-list{gap:var(--space-sm);display:grid}@media (width>=980px){.faq-layout-compact .faq-list{align-items:start;gap:var(--space-md);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.faq-layout-compact .faq-item{min-width:0}}.faq-item{padding:0 var(--padding-card)}.faq-item summary{justify-content:space-between;align-items:center;gap:var(--space-md);color:#1f2937;min-height:58px;font-weight:var(--font-weight-bold);cursor:pointer;display:flex}.faq-item summary:after{content:"+";color:var(--purple);flex:none;font-size:1.35rem;line-height:1}.faq-item[open] summary:after{content:"-"}.faq-item summary::-webkit-details-marker{display:none}.faq-item p{padding:0 0 var(--space-lg);color:#1f2937;margin:0;line-height:1.6}@media (width>=980px){.faq-page{--faq-intro-col:calc((var(--section-width) - var(--space-lg)) / 2)}.faq-page .tool-guide-index>div:first-child p:last-child,.faq-page .tool-guide-card p,.faq-page .faq-summary-panel p:last-child{max-width:min(100%, calc(var(--faq-intro-col) - (var(--padding-card) * 2)))}.faq-page .tool-guide-details p,.faq-page .tool-guide-details ul{max-width:min(100%, calc(var(--faq-intro-col) - (var(--space-md) * 2)))}.faq-page .faq-item p{max-width:min(100%, calc(var(--faq-intro-col) - (var(--padding-card) * 2)))}}.scale-swatch-label{font-weight:var(--font-weight-bold)}.scale-swatch-hex{font-variant-numeric:tabular-nums;opacity:.9;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.color-palette-container{gap:var(--space-lg);flex-direction:column;display:flex}.palette-toolbar{justify-content:space-between;align-items:flex-end;gap:var(--space-lg);display:flex}.palette-toolbar .card-heading{font-weight:var(--font-weight-bold)}.palette-count{color:#374151;margin:0;font-size:.9rem}.add-color-control{justify-content:flex-end;align-items:center;gap:var(--space-sm);flex-wrap:wrap;display:flex}.color-name-input{border:var(--border-default);border-radius:var(--border-radius-secondary);width:150px;min-height:42px;padding:0 var(--space-md);font:inherit}.color-name-input:focus{outline:var(--outline-selected);outline-offset:2px}.hex-input-shell{border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);align-items:center;width:130px;min-height:42px;display:flex}.hex-input-shell:focus-within{outline:var(--outline-selected);outline-offset:2px}.hex-input-shell span{padding-left:var(--space-md);color:#374151;font-weight:var(--font-weight-bold)}.hex-input-shell input{min-width:0;padding:0 var(--space-md) 0 var(--space-xs);font:inherit;text-transform:lowercase;border:none;flex:1}.hex-input-shell input:focus{outline:none}.add-color-control>input{border:var(--border-default);border-radius:var(--border-radius-secondary);width:130px;min-height:42px;padding:0 var(--space-md);font:inherit;text-transform:lowercase}.add-color-control>input:focus{outline:var(--outline-selected);outline-offset:2px}.add-color-button,.edit-color-button,.delete-color-button,.edit-color-action-button{border:var(--border-default);background-color:var(--surface-color);font:inherit;cursor:pointer}.add-color-button{min-height:42px;padding:0 var(--space-md);border-radius:var(--border-radius-secondary);font-weight:var(--font-weight-bold)}.add-color-button:disabled{cursor:not-allowed;opacity:.45}.compare-color-container{box-sizing:border-box;gap:var(--space-md);background-color:var(--surface-color);width:auto;height:100%;padding:var(--space-lg);border-radius:var(--border-radius);border:var(--border-default);flex-direction:column;display:flex}.contrast-checker-section-palette-empty .compare-color-container,.contrast-checker-section-palette-empty .compare-mode-selector,.contrast-checker-section-palette-empty .select-color-result-container,.scale-generator-panel-palette-empty{opacity:.34;filter:grayscale(.35);pointer-events:none;-webkit-user-select:none;user-select:none;transition:opacity .18s,filter .18s}.compare-mode-option:disabled{cursor:not-allowed}.compare-color-header{justify-content:space-between;align-items:center;gap:var(--space-md);display:flex}.compare-color-header .card-heading{font-weight:var(--font-weight-bold);margin-bottom:0}.swap-color-button{align-items:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);min-height:38px;padding:0 var(--space-md);font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;display:inline-flex}.swap-color-button:hover{border-color:var(--purple);background-color:var(--light-purple)}.swap-color-button:disabled{cursor:not-allowed;opacity:.45}.selected-slot-control{gap:var(--space-sm);padding:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius);background-color:#f7f7fb;grid-template-columns:1fr 1fr;display:grid}.selected-slot-control button{border-radius:var(--border-radius-secondary);min-height:34px;font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;background-color:#0000;border:none}.selected-slot-control button:hover{background-color:var(--surface-color)}.selected-slot-control .selected-slot-active{background-color:var(--surface-color);box-shadow:0 0 0 1px #a7a4e08c}.compare-color-controls{gap:var(--space-lg);flex:1;grid-template-columns:1fr 1fr;display:grid}.compare-color-item{border-radius:var(--border-radius-secondary);cursor:pointer;flex:1;grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;transition:transform .15s;display:grid;position:relative}.compare-color-item:hover,.compare-color-item-active{transform:translateY(-1px)}.compare-color-title-row{justify-content:space-between;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-sm);display:flex}.compare-color-title-row .card-heading{margin-bottom:0}.selected-chip{border-radius:var(--border-radius-pill);background-color:var(--purple);color:var(--surface-color);font-size:.78rem;font-weight:var(--font-weight-bold);opacity:0;transform-origin:50%;white-space:nowrap;padding:3px 8px;transition:opacity .24s,transform .24s;transform:translateY(4px)scale(.92)}.compare-color-item-active .selected-chip{opacity:1;transform:translateY(0)scale(1)}.contrast-checker-text,.contrast-checker-text-single{align-items:center;gap:var(--space-sm);grid-template-columns:minmax(0,2fr) auto auto;display:grid}.compare-color-a,.compare-color-b{border:none;border-radius:0;height:100%;min-height:150px}.selected-color-body{border:var(--border-default);border-radius:var(--border-radius-secondary);grid-template-rows:minmax(150px,1fr) auto;min-height:0;transition:border-color .15s,box-shadow .15s;display:grid;overflow:hidden}.compare-color-item-active .selected-color-body{border-color:var(--purple);box-shadow:0 0 0 1px #5e5aa373}.color-item-text{background-color:var(--surface-color);padding:var(--space-md);border:var(--border-default);border-radius:0 0 var(--border-radius-secondary) var(--border-radius-secondary);margin:0}.selected-color-edit-panel{gap:var(--space-sm);padding:var(--space-sm);border:none;border-radius:0;transition:background-color .18s,border-color .18s;display:grid;position:relative}.selected-color-edit-panel:before{border-radius:0 0 var(--border-radius-secondary) var(--border-radius-secondary);content:"";opacity:0;pointer-events:none;background-color:#a7a4e012;transition:opacity .24s,transform .24s;position:absolute;inset:0;transform:scaleX(.96)}.compare-color-item-active .selected-color-edit-panel:before{opacity:1;transform:scaleX(1)}.selected-color-edit-panel>*{position:relative}.selected-color-input-shell{align-items:center;min-width:0;display:flex;position:relative}.selected-color-input-shell input{border:var(--border-default);border-radius:var(--border-radius-secondary);width:100%;min-width:0;min-height:36px;padding:0 42px 0 var(--space-sm);font:inherit;text-transform:lowercase}.selected-color-input-shell input:focus{outline:var(--outline-selected);outline-offset:2px}.selected-color-edit-panel label{gap:var(--space-xs);color:#555;font-size:.85rem;display:grid}.selected-color-edit-panel input[type=range]{width:100%;accent-color:var(--purple)}.hue-slider{appearance:none;cursor:pointer;background:0 0;height:18px}.hue-slider:focus{outline:none}.hue-slider::-webkit-slider-runnable-track{border-radius:var(--border-radius-pill);background:var(--purple);border:1px solid #11182729;height:10px}.hue-slider::-webkit-slider-thumb{appearance:none;border:3px solid var(--surface-color);border-radius:var(--border-radius-pill);background-color:var(--purple);width:22px;height:22px;margin-top:-7px;box-shadow:0 0 0 1px #11182733,0 4px 10px #5e5aa359}.hue-slider::-moz-range-track{border-radius:var(--border-radius-pill);background:linear-gradient(90deg,#ef4444,#f59e0b,#facc15,#22c55e,#06b6d4,#3b82f6,#8b5cf6,#ec4899,#ef4444);border:1px solid #11182729;height:10px}.hue-slider::-moz-range-thumb{border:3px solid var(--surface-color);border-radius:var(--border-radius-pill);background-color:var(--purple);width:18px;height:18px;box-shadow:0 0 0 1px #11182733,0 4px 10px #5e5aa359}.empty-panel-state{align-content:center;place-items:center;gap:var(--space-sm);border:1px dashed var(--light-gray);border-radius:var(--border-radius);min-height:120px;padding:var(--space-md);text-align:center;background-color:#fafafa;display:grid}.empty-panel-state p{color:#374151;max-width:260px;margin:0}.empty-panel-state .material-symbols-outlined{color:#4b5563;font-size:1.5rem}.empty-result-card{min-height:320px}.quiet-empty-state{justify-content:center;align-items:center;gap:var(--space-sm);border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);color:#374151;min-height:120px;display:flex}.quiet-empty-state p{margin:0}.added-colors-container{align-items:start;gap:var(--space-sm);grid-template-columns:repeat(5,minmax(0,1fr));display:grid}.palette-empty-callout{align-content:center;place-items:center;gap:var(--space-sm);border-radius:var(--border-radius);color:#555;min-height:150px;padding:var(--space-lg);text-align:center;background-color:#fbfbfe;border:1px dashed #5e5aa36b;grid-column:1/-1;display:grid}.palette-empty-callout p{font-weight:var(--font-weight-bold);margin:0}.palette-empty-callout .material-symbols-outlined{color:var(--purple);font-size:1.65rem}.palette-swatch-card{gap:var(--space-sm);min-width:0;padding:var(--space-sm);border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);-webkit-user-select:none;user-select:none;transition:transform .15s,box-shadow .15s,border-color .15s;display:grid;position:relative}.palette-swatch-card:hover{transform:translateY(-1px);box-shadow:0 8px 18px #11182714}.palette-swatch-card-selected{border-color:var(--purple);box-shadow:0 0 0 2px #a7a4e040}.palette-swatch-card p,.copy-hex-button{font-size:.82rem;font-weight:var(--font-weight-medium);text-align:center;text-overflow:ellipsis;white-space:nowrap;margin:0;overflow:hidden}.palette-swatch-card .palette-color-name{color:#1f2937;font-weight:var(--font-weight-bold)}.palette-preview-shell{position:relative}.copy-hex-button,.copy-selected-color-button{justify-content:center;align-items:center;gap:var(--space-xs);color:inherit;font:inherit;cursor:pointer;background-color:#0000;border:none;display:inline-flex}.copy-hex-button{min-width:0;padding:0}.copy-hex-button span:first-child{text-overflow:ellipsis;overflow:hidden}.copy-hex-button .material-symbols-outlined{opacity:0;transition:opacity .15s}.palette-swatch-card:hover .copy-hex-button .material-symbols-outlined,.copy-hex-button:focus-visible .material-symbols-outlined{opacity:1}.copy-selected-color-button{border-radius:var(--border-radius-secondary);width:32px;height:28px;min-height:34px;font-weight:var(--font-weight-bold);background-color:#0000;border:none;position:absolute;right:4px}.copy-selected-color-button:hover{background-color:var(--light-purple);color:var(--purple)}.tune-selected-color-button{justify-content:center;align-items:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);min-height:34px;color:inherit;font:inherit;font-size:.85rem;font-weight:var(--font-weight-bold);cursor:pointer;display:inline-flex}.tune-selected-color-button:hover{border-color:var(--purple);background-color:var(--light-purple)}.tune-selected-color-button .material-symbols-outlined{font-size:1rem}.tune-button-label-short{display:none}.palette-swatch-tags{left:var(--space-xs);top:var(--space-xs);gap:var(--space-xs);pointer-events:none;-webkit-user-select:none;user-select:none;transition:opacity .15s;display:flex;position:absolute}.palette-swatch-tags span{border:var(--border-default);border-radius:var(--border-radius-pill);background-color:var(--surface-color);font-size:.78rem;font-weight:var(--font-weight-bold);padding:2px 7px}.palette-swatch-card:hover .palette-swatch-tags{opacity:0}.edit-color-button,.delete-color-button{top:var(--space-xs);border-radius:var(--border-radius-pill);opacity:0;justify-content:center;align-items:center;width:26px;height:26px;padding:0;transition:opacity .15s,background-color .15s;display:inline-flex;position:absolute}.edit-color-button{right:calc(26px + var(--space-sm))}.delete-color-button{right:var(--space-xs)}.palette-swatch-card:hover .delete-color-button,.palette-swatch-card:hover .edit-color-button,.delete-color-button:focus-visible,.edit-color-button:focus-visible{opacity:1}.delete-color-button:hover{background-color:var(--light-red)}.edit-color-button:hover{background-color:var(--light-purple);color:var(--purple)}.edit-color-name-input,.edit-color-input{border:var(--border-default);border-radius:var(--border-radius-secondary);min-width:0;min-height:34px;padding:0 var(--space-sm);font:inherit;text-align:center}.edit-color-input{text-transform:lowercase}.edit-color-name-input:focus,.edit-color-input:focus{outline:var(--outline-selected);outline-offset:2px}.edit-color-actions{gap:var(--space-xs);grid-template-columns:1fr 1fr;display:grid}.edit-color-action-button{border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);min-height:32px;color:inherit;font:inherit;cursor:pointer;justify-content:center;align-items:center;display:inline-flex}.edit-color-action-button:disabled{cursor:not-allowed;opacity:.45}.edit-color-action-primary{background-color:var(--purple);color:var(--surface-color);border-color:#0000}.edit-color-action-primary:hover:not(:disabled){background-color:#4d4989}.edit-color-action-secondary{color:var(--purple);border-color:#5e5aa361}.edit-color-action-secondary:hover{border-color:var(--purple);background-color:var(--light-purple)}.edit-color-overlay{z-index:10000000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#1118276b;place-items:center;padding:clamp(24px,7vw,48px);display:grid;position:fixed;inset:0;overflow-y:auto}.edit-color-modal{gap:var(--space-xl);box-sizing:border-box;border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);width:min(420px,100%);max-height:calc(100dvh - clamp(48px,14vw,96px));padding:var(--space-lg);display:grid;overflow-y:auto;box-shadow:0 24px 70px #11182747}.contrast-adjust-modal{width:min(1180px,100%)}.contrast-adjust-title-row{align-items:center;gap:var(--space-xs);display:flex}.contrast-adjust-title-row .card-heading{margin-bottom:0}.contrast-adjust-help-button{border-radius:var(--border-radius-pill);width:30px;height:30px;color:var(--purple);cursor:pointer;background-color:#0000;border:none;justify-content:center;align-items:center;display:inline-flex}.contrast-adjust-help-button[aria-expanded=true]{background-color:var(--light-purple)}.contrast-adjust-help-button .material-symbols-outlined{font-size:1.05rem}.contrast-adjust-help-panel{border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--light-purple);padding:var(--space-md);border-color:#5e5aa338}.contrast-adjust-help-panel p{color:#374151;margin:0;line-height:1.55}.edit-color-modal-header{justify-content:space-between;align-items:flex-start;gap:var(--space-md);display:flex}.edit-color-modal-header .card-heading{margin-bottom:var(--space-xs);font-weight:var(--font-weight-bold)}.edit-color-modal-header p{margin:0}.edit-color-modal-header p:last-child{color:#555;font-size:.9rem}.edit-color-modal-close{border:var(--border-default);border-radius:var(--border-radius-pill);background-color:var(--light-purple);width:34px;height:34px;color:var(--purple);cursor:pointer;border-color:#5e5aa347;flex:none;justify-content:center;align-items:center;display:inline-flex}.edit-color-modal-close:hover{border-color:var(--purple);background-color:#deddf5}.edit-color-modal-preview{border:var(--border-default);border-radius:var(--border-radius);min-height:120px}.edit-color-modal-field{gap:var(--space-xs);color:#555;font-size:.88rem;font-weight:var(--font-weight-bold);display:grid}.edit-color-modal-field input{text-align:left;min-height:42px}.edit-color-modal .edit-color-actions{gap:var(--space-sm)}.edit-color-modal .edit-color-action-button{gap:var(--space-xs);min-height:42px;font-weight:var(--font-weight-bold)}.contrast-adjust-layout{gap:var(--space-xl);grid-template-columns:minmax(280px,.38fr) minmax(0,1fr);align-items:start;display:grid}.contrast-adjust-controls,.contrast-map-panel{gap:var(--space-md);min-width:0;display:grid}.contrast-adjust-preview{align-content:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius);min-height:150px;padding:var(--space-lg);display:grid}.contrast-adjust-preview strong{font-size:1.5rem}.contrast-adjust-preview span{font-weight:var(--font-weight-bold)}.contrast-adjust-color-row{gap:var(--space-sm);grid-template-columns:1fr 1fr;display:grid}.contrast-adjust-color-row div{border:var(--border-default);border-radius:var(--border-radius-secondary);padding:var(--space-sm);background-color:#f7f7fb;gap:2px;display:grid}.contrast-adjust-color-row span{color:#555;font-size:.78rem;font-weight:var(--font-weight-bold)}.contrast-adjust-color-row strong{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.86rem}.contrast-adjust-hex-shell{width:100%}.contrast-adjust-hex-shell input{min-height:40px}.contrast-adjust-swap-button{justify-content:center;align-items:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);min-height:38px;color:inherit;font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;display:inline-flex}.contrast-adjust-swap-button:hover{border-color:var(--purple);background-color:var(--light-purple)}.contrast-adjust-slider{gap:var(--space-xs);color:#555;font-size:.88rem;font-weight:var(--font-weight-bold);display:grid}.contrast-adjust-slider span{justify-content:space-between;gap:var(--space-md);display:flex}.contrast-adjust-slider input[type=range]{width:100%;accent-color:var(--purple)}.contrast-adjust-range{appearance:none;cursor:pointer;background:0 0;height:18px}.contrast-adjust-range:focus{outline:none}.contrast-adjust-range::-webkit-slider-runnable-track{border-radius:var(--border-radius-pill);background:var(--purple);border:1px solid #11182729;height:10px}.contrast-adjust-range::-webkit-slider-thumb{appearance:none;border:3px solid var(--surface-color);border-radius:var(--border-radius-pill);background-color:var(--purple);width:22px;height:22px;margin-top:-7px;box-shadow:0 1px 4px #11182738}.contrast-adjust-range::-moz-range-track{border-radius:var(--border-radius-pill);background:var(--purple);border:1px solid #11182729;height:10px}.contrast-adjust-range::-moz-range-thumb{border:3px solid var(--surface-color);border-radius:var(--border-radius-pill);background-color:var(--purple);width:16px;height:16px;box-shadow:0 1px 4px #11182738}.contrast-adjust-actions{gap:var(--space-sm);border-top:var(--border-default);padding-top:var(--space-md);flex-wrap:wrap;justify-content:flex-end;display:flex}.contrast-adjust-actions .edit-color-action-button{min-width:160px;padding:0 var(--space-md)}.contrast-map-header{justify-content:space-between;align-items:flex-end;gap:var(--space-md);display:flex}.contrast-map-header .card-heading{margin-bottom:var(--space-xs);font-weight:var(--font-weight-bold)}.contrast-map-header p:last-child{color:#555;margin:0;line-height:1.45}.contrast-map-legend{gap:var(--space-sm);color:#555;font-size:.82rem;font-weight:var(--font-weight-bold);flex-wrap:wrap;justify-content:flex-end;display:flex}.contrast-map-legend>span{align-items:center;gap:var(--space-xs);display:inline-flex}.contrast-map-legend .material-symbols-outlined{color:var(--purple);font-size:1rem}.contrast-map-grid{grid-template-columns:repeat(var(--contrast-map-columns), minmax(22px, 1fr));gap:4px;display:grid}.contrast-map-cell{aspect-ratio:1;cursor:pointer;border:1px solid #1118271f;border-radius:3px;place-items:center;min-width:0;padding:0;display:grid}.contrast-map-cell span{opacity:1;text-shadow:0 1px 2px #11182740;font-size:.85rem;line-height:1}.contrast-map-cell-pass{opacity:1}.contrast-map-cell-fail{opacity:.58}.contrast-map-cell:hover,.contrast-map-cell:focus-visible,.contrast-map-cell-current{outline:3px solid var(--purple);outline-offset:1px;opacity:1}.passing-candidates-panel{display:none}.passing-candidates-panel>div:first-child{gap:var(--space-xs);display:grid}.passing-candidates-panel .card-heading{font-weight:var(--font-weight-bold);margin-bottom:0}.passing-candidates-panel p:last-child{color:#374151;margin:0;line-height:1.45}.passing-candidates-grid{gap:var(--space-sm);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.passing-candidate-swatch{border:var(--border-default);border-radius:var(--border-radius-secondary);min-height:74px;padding:var(--space-sm);font:inherit;text-align:left;cursor:pointer;align-content:end;gap:2px;display:grid}.passing-candidate-swatch strong,.passing-candidate-swatch span{text-shadow:0 1px 2px #1118273d}.passing-candidate-swatch strong{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.passing-candidate-swatch span{font-size:.82rem;font-weight:var(--font-weight-bold)}.passing-candidate-swatch-active{outline:3px solid var(--purple);outline-offset:2px}.compare-mode-selector,.compare-mode-selector-buttons{gap:var(--space-sm);display:flex}.compare-mode-export-option{align-items:center;gap:var(--space-xs);font-weight:var(--font-weight-bold);opacity:.9;display:inline-flex}.compare-mode-export-option .material-symbols-outlined{font-size:1.05rem}.compare-more-menu-shell{display:none;position:relative}.compare-mode-more-trigger{justify-content:center;align-items:center;gap:0;display:inline-flex}.compare-mode-more-trigger .material-symbols-outlined{font-size:1.2rem}.compare-more-menu{z-index:100000;border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);border-color:#5e5aa338;min-width:180px;padding:6px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 18px 40px #1118272e}.compare-more-menu-item{align-items:center;gap:var(--space-sm);border-radius:var(--border-radius-secondary);width:100%;min-height:38px;padding:0 var(--space-md);font:inherit;font-weight:var(--font-weight-bold);color:inherit;cursor:pointer;white-space:nowrap;background-color:#0000;border:none;display:flex}.compare-more-menu-item:hover:not(:disabled){background-color:var(--light-purple)}.compare-more-menu-item:disabled{opacity:.45;cursor:not-allowed}.compare-more-menu-item .material-symbols-outlined{color:var(--purple);font-size:1.05rem}.compare-mode-option{padding:var(--padding-button);background-color:var(--surface-color);border-radius:var(--border-radius) var(--border-radius) 0 0;border:var(--border-default);color:inherit;font:inherit;font-weight:var(--font-weight-medium);z-index:99999;transform:translateY(var(--border-width));cursor:pointer;opacity:.72;transition:opacity .15s,background-color .15s,border-color .15s}.compare-mode-option:hover{opacity:1}.compare-mode-option-active{border-bottom-color:var(--surface-color);font-weight:var(--font-weight-bold);opacity:1;box-shadow:0 -2px 0 var(--purple) inset}.compare-mode-selector-buttons>:first-child{margin-left:calc(var(--padding-card) - var(--compare-mode-offset))}.compare-mode-selector-mobile{display:none}.compare-color-section{gap:var(--space-lg);grid-template-columns:1fr 1fr;width:100%;display:grid}.compare-info-text{justify-content:flex-start;align-items:center;gap:var(--space-sm);font-weight:var(--font-weight-bold);display:flex}.contrast-heading-row{margin-bottom:var(--space-md)}.compare-color-text-container{background-color:var(--surface-color);padding:var(--space-lg);border-radius:var(--border-radius);border:var(--border-default)}.contrast-ratio-container{justify-content:flex-start;align-items:center;gap:var(--space-md);border-bottom:var(--border-default);padding-bottom:var(--space-lg);display:flex}.contrast-checker-container{gap:var(--space-lg);padding-top:var(--space-lg);display:grid}.contrast-checker-group{gap:var(--space-sm);padding-bottom:var(--space-lg);border-bottom:var(--border-default);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid}.contrast-checker-text,.contrast-checker-text-single{grid-column:1/-1}.contrast-checker-group:last-child{border-bottom:none}.contrast-checker-group h4{margin:0}.usage-note{border-left:2px solid var(--light-gray);width:100%;max-width:34rem;padding-left:var(--space-md);color:#374151;grid-column:1;font-size:.88rem;line-height:1.45}.usage-note span{color:#1f2937;font-size:.72rem;font-weight:var(--font-weight-bold);letter-spacing:0;text-transform:uppercase}.usage-note p{margin:0}.contrast-text{margin:0;font-size:3rem}.color-great{background-color:var(--light-green)}.color-good{background-color:var(--light-blue)}.color-ok{background-color:var(--light-yellow)}.color-poor{background-color:var(--light-red)}.color-preview{border-radius:var(--border-radius-secondary);border:var(--border-default);cursor:pointer;width:100%;height:85px}.color-preview.selected{outline:var(--outline-selected)}.preview-section .card-heading{font-weight:var(--font-weight-bold)}.preview-section .panel-heading-row{margin-bottom:var(--space-md)}.color-preview-container{gap:var(--space-lg);min-height:420px;padding:var(--space-lg);border:var(--border-default);border-radius:var(--border-radius);box-shadow:inset 0 0 0 1px color-mix(in srgb, currentColor 14%, transparent);display:grid}.preview-topbar,.preview-hero-row,.preview-content-grid{border-color:color-mix(in srgb, currentColor 26%, transparent)}.preview-topbar{justify-content:space-between;align-items:center;gap:var(--space-md);padding-bottom:var(--space-md);border-bottom:1px solid;display:flex}.preview-window-dots span{border-radius:var(--border-radius-pill);border:1px solid;width:9px;height:9px}.preview-status-pill{border-radius:var(--border-radius-pill);font-size:.82rem;font-weight:var(--font-weight-bold);border:1px solid;padding:4px 10px}.preview-hero-row{gap:var(--space-lg);padding-bottom:var(--space-lg);border-bottom:1px solid;grid-template-columns:1fr 1fr;align-items:end;display:grid}.preview-title{margin:0 0 var(--space-md);font-size:1.75rem}.preview-metric{border-radius:var(--border-radius);border:1px solid;align-content:center;place-items:center;min-width:96px;min-height:100%;display:grid}.preview-metric strong{font-size:1.75rem;line-height:1}.preview-metric span{margin-top:var(--space-xs);font-size:.82rem;font-weight:var(--font-weight-bold)}.preview-content-grid{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}.preview-sample-block{align-content:start;gap:var(--space-sm);min-width:0;padding:var(--space-md);border-radius:var(--border-radius);border:1px solid;display:grid}.preview-sample-block h4,.preview-sample-block p{margin:0}.preview-ui-sample{gap:var(--space-md)}.preview-progress-track{border-radius:var(--border-radius-pill);border:1px solid;height:12px;overflow:hidden}.preview-progress-fill{background-color:currentColor;width:66%;height:100%}.preview-ui-sample button{border-radius:var(--border-radius-secondary);min-height:40px;padding:0 var(--space-md);font:inherit;font-weight:var(--font-weight-bold);border:1px solid}.preview-text-24-medium{font-size:var(--preview-text-24);font-weight:var(--font-weight-medium)}.preview-text-24-regular{font-size:var(--preview-text-24);font-weight:var(--font-weight-regular)}.preview-text-19-bold{font-size:var(--preview-text-19);font-weight:var(--font-weight-bold)}.preview-text-16-medium{font-size:var(--preview-text-16);font-weight:var(--font-weight-medium)}.preview-text-16-regular{font-size:var(--preview-text-16);font-weight:var(--font-weight-regular)}.preview-text-14-regular{font-size:var(--preview-text-14);font-weight:var(--font-weight-regular)}.contrast-check,.contrast-text-status{gap:var(--space-xs);width:fit-content;padding:var(--padding-badge);border-radius:var(--border-radius-pill);justify-content:flex-end;align-items:center;margin:0;display:inline-flex}.success{background-color:var(--light-green)}.error{background-color:var(--light-red)}.material-symbols-outlined{font-size:var(--icon-size)}.palette-compare-section{background-color:var(--surface-color);border:var(--border-default);border-radius:var(--border-radius);flex-direction:column;display:flex;overflow-x:auto}.scale-compare-section{margin-top:var(--space-lg)}.scale-page-scale-row .scale-compare-section{margin-top:var(--space-sm)}.palette-compare-intro{justify-content:space-between;align-items:flex-end;gap:var(--space-xl);padding:var(--space-lg) var(--padding-card);border-bottom:var(--border-default);background-color:var(--surface-color);display:flex}.scale-compare-intro{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;display:grid}.scale-compare-intro>div:first-child{gap:var(--space-xs);grid-column:1;display:grid}.scale-compare-intro p{margin:0}.scale-compare-intro .scale-contrast-heading{margin-bottom:var(--space-xs);font-weight:var(--font-weight-bold)}.scale-contrast-copy{color:#555;line-height:1.55}.palette-compare-intro .card-heading{font-weight:var(--font-weight-bold)}.palette-compare-intro .palette-compare-copy{color:#555;max-width:680px;margin:0;line-height:1.55}.palette-compare-copy-list{display:none}.palette-compare-tools{justify-content:space-between;align-items:center;gap:var(--space-md);padding:var(--space-lg) var(--padding-card);border-bottom:var(--border-default);flex-wrap:wrap;display:flex}.palette-compare-tools-left{align-items:center;gap:var(--space-md);flex-wrap:wrap;display:inline-flex}.palette-export-trigger{color:var(--purple);border-color:#5e5aa361}.palette-export-trigger:hover:not(:disabled){border-color:var(--purple);background-color:var(--light-purple)}.palette-export-modal{width:min(980px,100%)}.palette-export-modal-body{gap:var(--space-md);display:grid}.palette-export-controls-row{justify-content:flex-end}.palette-view-toggle{border-radius:var(--border-radius-secondary);gap:var(--space-sm);background-color:#5e5aa31f;width:fit-content;padding:4px;display:inline-flex}.palette-view-option{border-radius:var(--border-radius-secondary);color:#374151;min-height:34px;padding:0 var(--space-md);font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;white-space:nowrap;background-color:#0000;border:none}.palette-view-option:hover{background-color:#ffffffb3}.palette-view-option-active{background-color:var(--surface-color);color:var(--purple);box-shadow:0 0 0 1px #5e5aa32e}.palette-compare-view-hidden{display:none!important}.palette-pass-switch{align-items:center;gap:var(--space-sm);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);color:#374151;width:fit-content;min-height:42px;font:inherit;font-weight:var(--font-weight-bold);padding:0 var(--space-md);cursor:pointer;display:inline-flex}.palette-pass-switch input{opacity:0;pointer-events:none;position:absolute}.switch-track{border-radius:var(--border-radius-pill);background-color:#d1d5db;border:1px solid #1118271f;flex:none;align-items:center;width:42px;height:24px;transition:background-color .18s,border-color .18s;display:inline-flex;position:relative}.switch-thumb{border-radius:var(--border-radius-pill);background-color:var(--surface-color);width:18px;height:18px;transition:transform .18s;position:absolute;left:3px;box-shadow:0 1px 3px #1118273d}.palette-pass-switch input:checked+.switch-track{border-color:var(--purple);background-color:var(--purple)}.palette-pass-switch input:checked+.switch-track .switch-thumb{transform:translate(18px)}.palette-pass-switch input:focus-visible+.switch-track{outline:var(--outline-selected);outline-offset:2px}.palette-pass-switch:hover .switch-track{border-color:var(--purple)}.palette-pass-switch:has(input:checked){background-color:var(--light-purple);color:var(--purple);border-color:#5e5aa36b}.palette-compare-container{gap:var(--space-sm);background-color:var(--surface-color);padding:var(--padding-card);grid-template-columns:160px 1fr;grid-template-areas:".header""sidebar main";display:grid}.palette-header-row{gap:var(--space-sm);grid-area:header;display:grid}.palette-sidebar-column{gap:var(--space-sm);grid-area:sidebar;display:grid}.palette-main-grid{gap:var(--space-sm);grid-area:main;display:grid}.palette-background{border:var(--border-default);border-radius:var(--border-radius-secondary);width:100%;min-width:78px;height:42px}.palette-color-label{cursor:pointer;border-radius:var(--border-radius-secondary);min-height:88px;transition:opacity .15s,transform .15s}.palette-color-label:hover{transform:translateY(-1px)}.palette-color-label p{margin:var(--space-xs) 0 0;text-align:center;font-size:.85rem}.palette-label-text{gap:2px;min-width:0;display:grid}.palette-color-label .palette-label-name,.palette-color-label .palette-label-hex{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.palette-color-label .palette-label-name{color:#1f2937;font-weight:var(--font-weight-bold)}.palette-color-label .palette-label-hex{color:#666;margin-top:0;font-size:.78rem}.palette-color-label-side{align-items:center;gap:var(--space-sm);grid-template-columns:42px 1fr;min-height:74px;display:grid}.palette-color-label-side .palette-background{min-width:42px}.palette-color-label-side p{text-align:left;margin:0}.palette-color-label-active .palette-background{outline:var(--outline-selected);outline-offset:2px}.palette-color-label-active p{font-weight:var(--font-weight-bold)}.palette-color-label-active .palette-background{outline-offset:2px}.palette-result-cell{justify-content:center;align-items:center;gap:var(--space-xs);border:var(--border-default);border-radius:var(--border-radius-secondary);cursor:pointer;flex-direction:column;min-width:78px;min-height:74px;font-size:.85rem;transition:opacity .15s,transform .15s,box-shadow .15s;display:flex}.palette-result-cell:hover{transform:translateY(-1px)}.palette-result-cell strong{font-weight:var(--font-weight-bold)}.palette-result-cell small{color:#555}.palette-result-pass{background-color:var(--light-green)}.palette-result-fail{background-color:var(--light-red)}.palette-result-same{background-color:var(--surface-color);color:#666}.palette-result-same small{color:#666}.palette-result-active{opacity:1;border-color:var(--purple);box-shadow:0 0 0 2px #484884b8,inset 0 0 0 999px #5e5aa314}.palette-result-muted{opacity:.35}.palette-focus-mode .palette-result-filtered{background-color:var(--subtle-surface-color);box-shadow:none;pointer-events:none}:root[data-theme=dark] .palette-focus-mode .palette-result-filtered{background-color:var(--surface-color)}.palette-focus-mode .palette-result-filtered strong,.palette-focus-mode .palette-result-filtered small,.palette-focus-mode .palette-result-filtered .material-symbols-outlined{visibility:hidden}.palette-focus-mode .palette-result-active.palette-result-filtered{border-color:var(--purple);box-shadow:0 0 0 2px #484884b8,inset 0 0 0 999px #5e5aa30a}:root[data-theme=dark] .palette-focus-mode .palette-result-active.palette-result-filtered{box-shadow:0 0 0 2px #a7a4e6b8,inset 0 0 0 999px #a7a4e60f}.palette-result-wait{opacity:.65}.palette-compare-mobile-list{display:none}.palette-compare-mobile-list.palette-compare-view-active{gap:var(--space-sm);padding:var(--padding-card);grid-template-columns:1fr;display:grid}.scale-compare-list-title{color:#555;font-size:.85rem;font-weight:var(--font-weight-bold);margin:0}:root[data-theme=dark] .scale-compare-list-title{color:var(--muted-text-color)}.scale-compare-list-selector{gap:var(--space-sm);padding:var(--space-sm);border:var(--border-default);border-radius:var(--border-radius);background-color:var(--surface-color);grid-template-columns:repeat(auto-fit,minmax(56px,1fr));display:grid}.scale-compare-list-swatch{border-radius:var(--border-radius-secondary);min-width:56px;color:inherit;font:inherit;font-weight:var(--font-weight-bold);cursor:pointer;background-color:#0000;border:none;justify-items:center;gap:6px;padding:8px 10px;display:grid}.scale-compare-list-swatch:hover{background-color:var(--light-purple)}.scale-compare-list-swatch:focus-visible{outline:var(--outline-selected);outline-offset:2px}.scale-compare-list-swatch-selected{background-color:var(--light-purple);box-shadow:0 0 0 1px #5e5aa347}.scale-compare-list-swatch-chip{border:var(--border-default);border-radius:var(--border-radius-secondary);width:34px;height:34px}.scale-compare-list-swatch-label{font-size:.78rem;line-height:1}.palette-mobile-pair{align-items:center;gap:var(--space-md);border:var(--border-default);border-radius:var(--border-radius-secondary);background-color:var(--surface-color);width:100%;padding:var(--space-md);color:inherit;font:inherit;text-align:left;cursor:pointer;grid-template-columns:auto minmax(0,1fr) auto;display:grid}.palette-mobile-pair-static{cursor:default}.palette-mobile-pair-colors{display:flex}.palette-mobile-pair-colors span{border:var(--border-default);border-radius:var(--border-radius-pill);width:34px;height:34px}.palette-mobile-pair-colors span+span{margin-left:-10px}.palette-mobile-pair-text,.palette-mobile-pair-result{gap:2px;min-width:0;display:grid}.palette-mobile-pair-text strong,.palette-mobile-pair-text small,.palette-mobile-pair-result strong,.palette-mobile-pair-result small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.palette-mobile-pair-text small,.palette-mobile-pair-result small{color:#555;font-size:.78rem}.palette-mobile-pair-result{justify-items:end}.palette-mobile-pair-result .material-symbols-outlined{display:none}.palette-mobile-pair-pass{background-color:var(--light-green)}.palette-mobile-pair-fail{background-color:var(--light-red)}.palette-mobile-pair-same{color:#666}.site-footer{background-color:var(--purple);color:var(--surface-color);margin-top:auto}.footer-content{max-width:var(--section-width);justify-content:space-between;align-items:center;gap:var(--space-xl);padding:var(--space-xl);margin:0 auto;display:flex}.footer-brand{gap:var(--space-md);display:grid}.footer-logo-svg{width:auto;height:26px;display:block}.footer-brand p{color:#ffffffd1;max-width:460px;margin:0;line-height:1.5}.footer-links{justify-content:flex-end;gap:var(--space-sm);flex-wrap:wrap;display:flex}.footer-links a{border:var(--border-default);min-height:38px;padding:0 var(--space-md);color:inherit;font-weight:var(--font-weight-bold);align-items:center;text-decoration:none;display:inline-flex}.footer-links .github-mark{width:20px;height:20px;display:block}.footer-links a:hover{background-color:#ffffff1f}.footer-links .footer-github-button{border-radius:var(--border-radius-secondary);color:#1c1a2f;background-color:#deddf5;border-color:#0000;justify-content:center;width:40px;height:40px;padding:0}.footer-links .footer-github-button:hover{color:#1c1a2f;background-color:#f4f3fb}:root[data-theme=dark] .navigation-container,:root[data-theme=dark] .site-footer{background-color:#1c1a2f}:root[data-theme=dark] .footer-brand p{color:#deddf5}:root[data-theme=dark] .footer-links a{color:#f4f3fb;border-color:#deddf54d}:root[data-theme=dark] .footer-links a:hover{background-color:#deddf51f}:root[data-theme=dark] .footer-links .footer-github-button{color:#1c1a2f;background-color:#deddf5;border-color:#0000}:root[data-theme=dark] .footer-links .footer-github-button:hover{color:#1c1a2f;background-color:#f4f3fb}:root[data-theme=dark] .info-icon-button{color:var(--muted-text-color)}:root[data-theme=dark] .info-icon-button:hover,:root[data-theme=dark] .info-icon-button-active{color:#deddf5}:root[data-theme=dark] .route-tabs-nav .route-tab{color:#f4f3fb}:root[data-theme=dark] .route-tabs-nav .route-tab-active,:root[data-theme=dark] .route-tabs-nav .route-tab-active:hover{color:#f4f3fb;background-color:#343255}:root[data-theme=dark] .theme-toggle-button{color:#f4f3fb}:root[data-theme=dark] .theme-toggle-button:hover,:root[data-theme=dark] .theme-toggle-button[aria-pressed=true]{background-color:#343255}:root[data-theme=dark] .tool-switcher-shell{background-color:color-mix(in srgb, var(--sticky-purple) 92%, transparent);border-bottom-color:#d8d7ee2e}:root[data-theme=dark] .tool-switcher,:root[data-theme=dark] .route-tab-active{background-color:var(--surface-color)}:root[data-theme=dark] .tool-switcher .route-tab{color:var(--muted-text-color)}:root[data-theme=dark] .tool-switcher .route-tab-active,:root[data-theme=dark] .scale-panel-switch-button-active,:root[data-theme=dark] .scale-css-format-option-active,:root[data-theme=dark] .compare-mode-option-active,:root[data-theme=dark] .palette-view-option-active{color:#f4f3fb;background-color:#343255}:root[data-theme=dark] .color-palette-section,:root[data-theme=dark] .compare-color-container,:root[data-theme=dark] .compare-color-text-container,:root[data-theme=dark] .preview-section,:root[data-theme=dark] .palette-compare-section,:root[data-theme=dark] .scale-generator-panel,:root[data-theme=dark] .scale-css-preview,:root[data-theme=dark] .tool-guide-index,:root[data-theme=dark] .tool-guide-card,:root[data-theme=dark] .faq-summary-panel,:root[data-theme=dark] .faq-item,:root[data-theme=dark] .selected-color-body,:root[data-theme=dark] .selected-color-edit-panel,:root[data-theme=dark] .edit-color-modal,:root[data-theme=dark] .panel-help-popover,:root[data-theme=dark] .contrast-map-panel,:root[data-theme=dark] .contrast-adjust-controls,:root[data-theme=dark] .passing-candidate-swatch,:root[data-theme=dark] .palette-mobile-pair,:root[data-theme=dark] .palette-color-label,:root[data-theme=dark] .palette-result-cell,:root[data-theme=dark] .scale-swatch-tile{border-color:var(--light-gray);color:var(--text-color)}:root[data-theme=dark] .intro-section p,:root[data-theme=dark] .scale-generator-subtitle,:root[data-theme=dark] .palette-count,:root[data-theme=dark] .palette-swatch-card .palette-color-name,:root[data-theme=dark] .usage-note,:root[data-theme=dark] .palette-mobile-pair-text small,:root[data-theme=dark] .palette-mobile-pair-result small,:root[data-theme=dark] .palette-mobile-pair-same,:root[data-theme=dark] .palette-compare-intro .palette-compare-copy,:root[data-theme=dark] .palette-compare-intro p,:root[data-theme=dark] .faq-section-intro p:last-child,:root[data-theme=dark] .scale-css-preview-header p:last-child,:root[data-theme=dark] .faq-summary-panel p:last-child,:root[data-theme=dark] .faq-item p,:root[data-theme=dark] .tool-guide-index p:last-child,:root[data-theme=dark] .tool-guide-card p,:root[data-theme=dark] .tool-guide-details ul,:root[data-theme=dark] .panel-help-popover>span:not(.panel-help-popover-header),:root[data-theme=dark] .edit-color-modal-header p:last-child,:root[data-theme=dark] .edit-color-modal-field,:root[data-theme=dark] .contrast-adjust-slider,:root[data-theme=dark] .contrast-adjust-color-row span,:root[data-theme=dark] .contrast-map-header p:last-child,:root[data-theme=dark] .contrast-map-legend,:root[data-theme=dark] .passing-candidates-panel p:last-child{color:var(--muted-text-color)}:root[data-theme=dark] .panel-help-popover strong,:root[data-theme=dark] .tool-guide-links a,:root[data-theme=dark] .palette-compare-intro strong,:root[data-theme=dark] .palette-compare-intro .scale-contrast-heading,:root[data-theme=dark] .contrast-adjust-color-row strong,:root[data-theme=dark] .faq-item summary,:root[data-theme=dark] .tool-guide-details ul,:root[data-theme=dark] .scale-css-format-option,:root[data-theme=dark] .scale-panel-switch-button,:root[data-theme=dark] .compare-mode-option,:root[data-theme=dark] .palette-view-option,:root[data-theme=dark] .selected-color-input-shell input,:root[data-theme=dark] input{color:var(--text-color)}:root[data-theme=dark] .selected-color-input-shell,:root[data-theme=dark] .contrast-adjust-color-row div,:root[data-theme=dark] .tool-guide-details,:root[data-theme=dark] .tool-visual,:root[data-theme=dark] .scale-panel-switch,:root[data-theme=dark] .scale-css-format-selector,:root[data-theme=dark] .palette-view-toggle,:root[data-theme=dark] .selected-slot-control,:root[data-theme=dark] .contrast-adjust-help-panel,:root[data-theme=dark] .intro-thresholds div,:root[data-theme=dark] .quiet-empty-state,:root[data-theme=dark] .palette-empty-callout,:root[data-theme=dark] .empty-panel-state{border-color:var(--light-gray);background-color:var(--subtle-surface-color);color:var(--text-color)}:root[data-theme=dark] .intro-eyebrow,:root[data-theme=dark] .intro-thresholds span,:root[data-theme=dark] .scale-steps-control,:root[data-theme=dark] .contrast-adjust-help-panel p,:root[data-theme=dark] .contrast-map-header p:last-child,:root[data-theme=dark] .palette-label-hex,:root[data-theme=dark] .tool-visual-selected-card span,:root[data-theme=dark] .tool-visual-meter span{color:var(--muted-text-color)}:root[data-theme=dark] .scale-swatch-hex{color:inherit}:root[data-theme=dark] .selected-slot-control button:hover,:root[data-theme=dark] .scale-css-format-option:hover,:root[data-theme=dark] .scale-panel-switch-button:hover,:root[data-theme=dark] .palette-view-option:hover,:root[data-theme=dark] .copy-selected-color-button:hover,:root[data-theme=dark] .tune-selected-color-button:hover,:root[data-theme=dark] .swap-color-button:hover,:root[data-theme=dark] .contrast-adjust-swap-button:hover,:root[data-theme=dark] .edit-color-action-secondary:hover,:root[data-theme=dark] .panel-help-close:hover,:root[data-theme=dark] .edit-color-modal-close:hover{color:#f4f3fb;background-color:#343255}:root[data-theme=dark] .palette-pass-switch{border-color:var(--light-gray);background-color:var(--surface-color);color:var(--text-color)}:root[data-theme=dark] .palette-pass-switch:has(input:checked){color:#f4f3fb;background-color:#343255;border-color:#a7a4e67a}:root[data-theme=dark] .switch-track{background-color:#d8d7ee2e;border-color:#d8d7ee59}:root[data-theme=dark] .selected-slot-control .selected-slot-active{background-color:var(--purple);color:#151426;box-shadow:0 0 0 1px #f4f3fb38}:root[data-theme=dark] .contrast-seo-summary-pass{--summary-bg-color:#253d2a;--summary-border-color:#86b58a}:root[data-theme=dark] .contrast-seo-summary-warn{--summary-bg-color:#473719;--summary-border-color:#d0a450}:root[data-theme=dark] .contrast-seo-summary-fail{--summary-bg-color:#4a2828;--summary-border-color:#d27b7b}:root[data-theme=dark] .contrast-seo-summary,:root[data-theme=dark] .contrast-seo-summary h2,:root[data-theme=dark] .contrast-seo-summary p,:root[data-theme=dark] .contrast-seo-summary .intro-eyebrow,:root[data-theme=dark] .contrast-seo-summary strong{color:var(--text-color)}:root[data-theme=dark] .contrast-summary-dismiss,:root[data-theme=dark] .contrast-add-pair-button{color:#f4f3fb;background-color:#343255;border-color:#d8d7ee4d}:root[data-theme=dark] .contrast-add-pair-button:hover:not(:disabled),:root[data-theme=dark] .contrast-summary-dismiss:hover{border-color:var(--purple);background-color:var(--purple);color:#151426}:root[data-theme=dark] .palette-swatch-card{border-color:var(--light-gray);background-color:var(--surface-color)}:root[data-theme=dark] input{background-color:var(--surface-color)}:root[data-theme=dark] .color-name-input,:root[data-theme=dark] .hex-input-shell{border-color:var(--light-gray)}:root[data-theme=dark] .hex-input-shell span{color:var(--muted-text-color)}:root[data-theme=dark] .color-name-input::placeholder,:root[data-theme=dark] .hex-input-shell input::placeholder{color:#d8d7eeb8}:root[data-theme=dark] .scale-code-window,:root[data-theme=dark] .scale-css-code,:root[data-theme=dark] .tool-visual-code pre{background-color:var(--code-bg-color);color:#f4f3fb}:root[data-theme=dark] .scale-code-copy-button{color:#f4f3fb;background-color:#5e5aa36b}:root[data-theme=dark] .scale-code-copy-button:hover{background-color:#5e5aa38c}:root[data-theme=dark] .success,:root[data-theme=dark] .palette-result-pass,:root[data-theme=dark] .palette-mobile-pair-pass,:root[data-theme=dark] .tool-visual-pass{color:#dff4cc;background-color:#253d2a}:root[data-theme=dark] .palette-result-cell small{color:currentColor}:root[data-theme=dark] .palette-result-same,:root[data-theme=dark] .palette-result-same small{color:#f4f3fb}:root[data-theme=dark] .palette-focus-mode .palette-result-filtered{background-color:var(--surface-color);color:#0000;box-shadow:none;pointer-events:none}:root[data-theme=dark] .palette-result-active{border-color:var(--purple);box-shadow:0 0 0 2px #a7a4e6b8,inset 0 0 0 999px #a7a4e61a}:root[data-theme=dark] .error,:root[data-theme=dark] .palette-result-fail,:root[data-theme=dark] .palette-mobile-pair-fail,:root[data-theme=dark] .tool-visual-fail{color:#ffd6d0;background-color:#4a2828}@media (width<=1180px){.section-width{max-width:none;padding:0 var(--space-lg)}.footer-content{max-width:none;padding-right:var(--space-lg);padding-left:var(--space-lg)}.intro-section,.top-grid,.top-grid-palette,.compare-color-section{grid-template-columns:1fr}.contrast-seo-summary{gap:var(--space-md);grid-template-columns:minmax(0,1fr) auto}.featured-contrast-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contrast-seo-summary>div{grid-area:auto/1;max-width:none}.intro-section{padding:44px 0 20px}.color-palette-section,.compare-color-container,.compare-color-text-container,.preview-section,.palette-compare-section{min-width:0}.palette-compare-intro{border-radius:var(--border-radius)}.palette-compare-section{overflow-x:visible}.palette-compare-container,.palette-view-toggle,.palette-compare-copy-grid{display:none}.palette-compare-copy-list{display:block}.palette-compare-mobile-list{gap:var(--space-sm);padding:var(--padding-card);grid-template-columns:repeat(2,minmax(0,1fr));display:grid!important}.added-colors-container{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width<=1024px){.scale-page-top-row{grid-template-columns:1fr}.scale-generator-page,.scale-page-layout,.scale-page-scale-row,.scale-generator-panel,.scale-css-preview,.scale-code-window,.scale-compare-section{min-width:0;max-width:100%}.scale-page-top-empty,.contrast-map-grid,.contrast-map-legend{display:none}.passing-candidates-panel{gap:var(--space-md);display:grid}}@media (width<=760px){:root{--padding-card:1rem;--space-lg:1rem;--space-xl:1.25rem}.section-width{padding:0 var(--space-md)}.tool-switcher-content{padding-right:var(--space-md);padding-left:var(--space-md)}.tool-switcher{grid-template-columns:1fr 1fr;width:100%;display:grid}.navigation-container{padding:0}.palette-compare-intro{flex-direction:column;align-items:stretch}.navigation-content{padding:var(--space-md);flex-direction:row;justify-content:space-between;align-items:center}.navigation-anchor-items{justify-content:flex-end}.footer-links{justify-content:flex-start}.footer-content{flex-direction:column;align-items:flex-start}.scale-page-top-row{grid-template-columns:1fr}.scale-page-top-empty{display:none}.scale-generator-header{grid-template-columns:1fr;align-items:stretch}.scale-generator-header>div:first-child,.scale-compare-intro{grid-template-columns:1fr}.scale-css-preview-header{flex-direction:column;align-items:stretch}.scale-css-controls{grid-template-columns:1fr;justify-content:flex-start;width:100%;min-width:0;display:grid}.scale-css-format-selector{grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;width:100%;min-width:0;display:grid}.scale-panel-switch{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-width:100%;display:grid;overflow-x:visible}.scale-panel-switch-button,.scale-css-format-option{min-width:0;padding-right:var(--space-sm);padding-left:var(--space-sm);white-space:normal;text-align:center;justify-content:center}.scale-steps-control{justify-items:start}.scale-steps-control input[type=range]{width:100%}.scale-swatch-grid,.faq-layout,.tool-guide-index,.tool-guide-card{grid-template-columns:1fr}.tool-guide-link-groups{grid-template-columns:1fr;gap:2rem}.faq-item{padding:0 var(--space-md)}.intro-section h1{font-size:2rem;line-height:1.08}.info-popover-container{margin-top:var(--space-md)}.info-icon-button{min-height:34px}.palette-toolbar{align-items:stretch;gap:var(--space-lg);flex-direction:column}.palette-toolbar .card-heading{margin-bottom:var(--space-xs);font-size:inherit}.contrast-adjust-layout{grid-template-columns:1fr}.contrast-map-header{flex-direction:column;align-items:flex-start}.contrast-map-header>div:first-child{display:none}.contrast-map-legend{justify-content:flex-start}.palette-count{font-size:.9rem}.add-color-control{justify-content:stretch;align-items:stretch;gap:var(--space-sm);grid-template-columns:minmax(0,1fr) auto;display:grid}.color-name-input,.hex-input-shell,.add-color-button{box-sizing:border-box}.color-name-input{width:100%;min-height:42px;padding:0 var(--space-md);font-size:inherit;grid-column:1/-1}.hex-input-shell{width:100%;min-height:42px}.add-color-button{min-height:42px;padding:0 var(--space-md);font-size:inherit}.color-name-input,.hex-input-shell{width:100%;min-height:40px}.color-name-input{padding:0 var(--space-sm)}.hex-input-shell span{padding-left:var(--space-sm)}.hex-input-shell input{padding-right:var(--space-sm)}.added-colors-container{gap:var(--space-md) var(--space-sm);grid-template-columns:repeat(4,minmax(0,1fr))}.palette-swatch-card{place-items:start center;gap:var(--space-sm);padding:var(--space-xs);padding-bottom:calc(var(--space-xs) * 2);border-radius:var(--border-radius);background-color:#0000;border-color:#0000;grid-template-columns:1fr;grid-template-areas:"preview""name";overflow:clip}.palette-swatch-card:hover{box-shadow:none;transform:none}.palette-swatch-card .palette-color-name{text-align:center;grid-area:name;width:100%;font-size:.78rem;line-height:1.2}.palette-preview-shell{grid-area:preview;width:clamp(56px,16vw,68px);height:clamp(56px,16vw,68px)}.palette-preview-shell .color-preview{border-radius:var(--border-radius-pill);height:100%}.palette-swatch-tags{top:60%;left:50%;transform:translate(-50%,-50%)}.palette-swatch-tags span{padding:1px 6px;font-size:.66rem}.palette-swatch-card:hover .palette-swatch-tags{opacity:1}.copy-hex-button{display:none}.edit-color-button,.delete-color-button{opacity:1;border-color:#1118271f;width:22px;height:22px;position:absolute}.edit-color-button{top:-4px;left:-4px}.delete-color-button{top:-4px;right:-4px}.edit-color-button .material-symbols-outlined,.delete-color-button .material-symbols-outlined{font-size:.82rem}.preview-hero-row,.preview-content-grid{grid-template-columns:1fr}.preview-metric{padding:var(--space-2xl);min-height:auto}.contrast-checker-text,.contrast-checker-text-single{grid-template-columns:minmax(0,1.6fr) auto auto}.contrast-checker-group h4{overflow-wrap:anywhere}.contrast-check,.contrast-text-status{white-space:nowrap;justify-content:center}.compare-color-container{gap:var(--space-sm);padding:var(--space-md)}.compare-color-header{align-items:center}.compare-color-header .card-heading{font-size:.95rem}.swap-color-button{min-height:34px;padding:0 var(--space-sm);font-size:.85rem}.selected-slot-control{gap:4px;padding:4px}.selected-slot-control button{min-height:30px;font-size:.85rem}.compare-color-controls{gap:var(--space-sm);grid-template-columns:repeat(2,minmax(0,1fr))}.compare-color-item{background-color:#0000;border:none;grid-template-rows:auto minmax(0,1fr);display:grid;overflow:visible}.compare-color-item-active{box-shadow:none}.compare-color-title-row{min-height:34px;margin-bottom:var(--space-xs);padding:0}.compare-color-title-row .card-heading{font-size:.82rem}.selected-chip{padding:2px 7px;font-size:.68rem}.compare-color-a,.compare-color-b{border:none;border-radius:0;height:100%;min-height:74px}.selected-color-body{border:var(--border-default);border-radius:var(--border-radius-secondary);grid-template-rows:minmax(74px,1fr) auto;overflow:hidden}.compare-color-item-active .selected-color-body{border-color:var(--purple);box-shadow:0 0 0 1px #5e5aa373}.selected-color-edit-panel{align-items:center;gap:var(--space-xs);padding:var(--space-xs);border:none;border-radius:0;grid-template-columns:1fr}.selected-color-input-shell input{min-height:32px;font-size:.85rem}.copy-selected-color-button{white-space:nowrap;min-height:28px;padding:0;font-size:.82rem}.tune-button-label-full{display:none}.tune-button-label-short{display:inline}.selected-color-edit-panel label{gap:2px;font-size:.75rem}.selected-color-edit-panel input[type=range]{height:18px}.compare-color-text-container{border-radius:var(--border-radius)}.contrast-ratio-container{align-items:center;gap:var(--space-sm);grid-template-columns:minmax(0,1fr) auto;display:grid}.contrast-text{font-size:clamp(2.25rem,13vw,3rem);line-height:1}.contrast-checker-container{gap:var(--space-sm)}.contrast-checker-group{gap:var(--space-sm);padding:var(--space-md);border:var(--border-default);border-radius:var(--border-radius);background-color:#fafafa;grid-template-columns:1fr}:root[data-theme=dark] .contrast-checker-group{border-color:var(--light-gray);background-color:var(--subtle-surface-color)}.contrast-checker-group:last-child{border-bottom:var(--border-default)}.contrast-checker-text,.contrast-checker-text-single{justify-content:start;gap:var(--space-md)}.contrast-checker-text{grid-template-columns:auto auto}.contrast-checker-text-single{grid-template-columns:auto}.contrast-checker-text h4,.contrast-checker-text-single h4{grid-column:1/-1;font-size:1rem}.contrast-check{padding:var(--padding-badge);justify-self:start;font-size:.82rem}.usage-note{border-left:none;grid-column:1;margin-left:0;padding-left:0;font-size:.86rem}.compare-mode-selector{margin-bottom:var(--space-sm);border:var(--border-default);border-radius:var(--border-radius);background-color:#f7f7fb;grid-template-columns:1fr 1fr auto;gap:4px;padding:4px;display:grid}:root[data-theme=dark] .compare-mode-selector{border-color:var(--light-gray);background-color:var(--subtle-surface-color)}.compare-mode-selector-buttons{display:contents}.compare-mode-selector-buttons>:first-child{margin-left:0}.compare-mode-export-desktop{display:none}.compare-more-menu-shell{grid-area:1/3;display:block}.compare-mode-selector-desktop{display:none}.compare-mode-selector-mobile{display:grid}.compare-mode-option{border-radius:var(--border-radius-secondary);min-height:44px;padding:0 var(--space-sm);text-align:center;z-index:auto;background-color:#0000;border:none;place-items:center;display:grid;transform:none}.compare-mode-option.compare-mode-export-desktop{display:none!important}.compare-mode-option-active{background-color:var(--surface-color);box-shadow:0 0 0 1px #a7a4e08c}:root[data-theme=dark] .compare-mode-option-active{background-color:var(--purple);color:#151426;box-shadow:0 0 0 1px #f4f3fb38}.color-preview-container{min-height:auto}.palette-compare-mobile-list{gap:var(--space-sm);padding:var(--padding-card);grid-template-columns:1fr}.featured-contrast-link-grid{grid-template-columns:1fr}.contrast-summary-actions{display:contents}.contrast-summary-dismiss{grid-area:1/2;justify-self:end}.contrast-add-pair-button{white-space:normal;grid-area:2/1/auto/-1;width:100%;min-width:0}.scale-compare-list-selector{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=460px){.passing-candidates-grid,.selected-slot-control{grid-template-columns:1fr}.compare-mode-selector{grid-template-columns:1fr 1fr auto}.compare-mode-option{min-height:40px;padding:0 var(--space-xs);font-size:.85rem}.palette-mobile-pair{grid-template-columns:auto minmax(0,1fr)}.palette-mobile-pair-result{grid-column:1/-1;grid-template-columns:auto 1fr auto;place-items:center start}.palette-mobile-pair-result .material-symbols-outlined{display:inline}}