/* ColorRow studio system. Load after route styles. All colors follow semantic tokens. */
:root{--studio-line:var(--cr-border);--studio-serif:Georgia,'Times New Roman',serif}
body,body.dark{--bg:var(--cr-canvas);--card:var(--cr-surface);--card-bg:var(--cr-surface);--text:var(--cr-ink);--muted:var(--cr-muted);--soft:var(--cr-surface-soft);--soft-2:var(--cr-surface-tint);--brand:var(--cr-brand);--border:var(--cr-border);background:var(--cr-canvas);color:var(--cr-ink);font-family:var(--cr-font-sans);-webkit-font-smoothing:antialiased}
body::before,body::after{content:none!important}*{box-sizing:border-box}img,svg,canvas{max-width:100%}button,input,select,textarea{font-family:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed}a{color:inherit}p a{text-decoration:underline;text-underline-offset:3px}main p{line-height:1.7}main h1,main h2,main h3{text-wrap:balance}main h1:not(#homeHeroTitle){font-size:clamp(2rem,4.2vw,3.6rem)!important;line-height:1.07!important;letter-spacing:-.045em!important;font-weight:700!important}main h2{letter-spacing:-.025em}main :where(section,article,aside,div){min-width:0}main pre{max-width:100%;overflow:auto}main code{overflow-wrap:anywhere}main [id]{scroll-margin-top:96px}
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--cr-focus)!important;outline-offset:4px!important;box-shadow:0 0 0 2px var(--cr-canvas)!important}
.cr-site-header{box-shadow:none!important}.cr-header-inner{min-height:78px}.cr-nav-link{font-weight:600}.cr-nav-actions .cr-header-cta{background:var(--cr-ink);color:var(--cr-canvas);border-color:var(--cr-ink)}.cr-brand-mark{box-shadow:none}.cr-nav-dropdown{border-radius:10px}.cr-dropdown-link{font-weight:650}.cr-footer-inner{padding-top:40px;padding-bottom:32px}.cr-site-footer{margin-top:64px;background:var(--cr-canvas)}.cr-footer-link{min-height:28px;display:inline-flex;align-items:center;font-weight:450}.cr-footer-bottom{display:flex;align-items:center;flex-wrap:wrap;gap:12px;font-size:12px}.cr-footer-bottom a{text-decoration:underline;text-underline-offset:3px}.studio-privacy-button{color:inherit;border:0;background:none;text-decoration:underline;padding:8px;font-size:inherit;min-height:36px}.cr-footer-brand p{max-width:28ch}
.cr-btn,.cr-icon-btn{font-weight:600;box-shadow:none;min-height:44px}.cr-btn--primary:hover{background:var(--cr-brand);filter:brightness(.94)}.cr-field,.cr-select{border-color:var(--cr-border-strong)}.cr-btn--ghost{border-color:transparent}.cr-generator-page,.cr-contrast-page,.cr-gradient-page,.cr-image-page,.cr-visualizer-page{padding-top:40px!important}.cr-mix,.cr-harmony,.cr-tints,.cr-scale,.cr-converter,.cr-tokens,.cr-cvd,.cr-pacc{padding-top:40px!important}main .page.active{animation:none}main .content-card{box-shadow:none;border-radius:var(--cr-radius-lg)}main .content-card:hover{transform:none}.cr-generator-workspace,.cr-mix-controls,.cr-mix-results,.cr-mix-compare{box-shadow:none}.cr-mix-intro{align-items:start}.cr-mix-result-preview{min-height:260px}.cr-mix-intro-note{background:var(--cr-surface-soft);border:0;font-size:14px}.cr-generator-palette{min-height:300px}.cr-generator-intro{margin-bottom:28px}.cr-generator-support{margin-top:40px}
/* Homepage: compact functional canvas, followed by a clear resource index. */
.cr-home.page{width:100%;max-width:1240px;margin:auto;padding:0 24px;min-height:0;animation:none}.studio-eyebrow{display:flex;align-items:center;gap:8px;margin:0 0 18px;color:var(--cr-muted);font:600 11px/1.4 var(--cr-font-mono);letter-spacing:.09em;text-transform:uppercase}.studio-eyebrow>span:empty{width:7px;height:7px;background:var(--cr-brand);border-radius:50%}.studio-hero{display:grid;grid-template-columns:.88fr 1.12fr;gap:56px;align-items:center;padding:76px 0 60px}.studio-hero h1{font-size:clamp(42px,4.7vw,66px);line-height:1.02;letter-spacing:-.055em;font-weight:650;margin:0 0 24px;max-width:12ch}.studio-hero h1 em{font:italic 1.02em/.98 var(--studio-serif);letter-spacing:-.045em;color:var(--cr-brand)}.studio-lede{font-size:18px;color:var(--cr-ink-soft);max-width:34ch;margin-bottom:26px}.studio-hero-cta{min-height:48px;padding-inline:20px;gap:22px}.studio-fine{font-size:12px;color:var(--cr-muted);line-height:1.6;margin-top:15px}.studio-workspace-label{display:flex;justify-content:space-between;font:500 10px/1.5 var(--cr-font-mono);letter-spacing:.12em;color:var(--cr-muted);margin-bottom:12px}.studio-hero .cr-home-hero-stage{border:1px solid var(--cr-border);border-radius:9px;box-shadow:none;animation:none}.studio-hero .cr-home-swatch-grid{min-height:310px}.studio-hero .cr-home-swatch{padding:9px}.studio-hero .cr-home-swatch::before{content:none}.studio-hero .cr-home-swatch-actions{gap:4px}.studio-hero .cr-home-hex-button,.studio-hero .cr-home-lock-button{backdrop-filter:none;background:transparent;border-color:transparent;min-height:42px;padding:0 2px;font-size:11px;border-radius:4px}.studio-hero .cr-home-lock-button{font-size:10px;border:1px solid currentColor;opacity:.9;min-height:32px}.studio-hero .cr-home-hex-button:hover{background:color-mix(in srgb,var(--home-swatch-ink) 12%,transparent)}.studio-hero .cr-home-swatch.is-locked::after{left:50%;transform:translateX(-50%);top:16px;padding:4px 6px;font-size:9px;border-radius:4px}.studio-hero .cr-home-hero-toolbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px;background:var(--cr-surface)}.studio-hero .cr-home-hero-toolbar .cr-btn{min-height:42px;font-size:12px;padding:10px 6px}.studio-hero .cr-home-text-link{font-size:11px;align-self:center;padding:5px 0;text-decoration:none;color:var(--cr-muted)}.studio-hero .cr-home-shortcut{justify-self:end;font-size:10px;margin:0}.studio-stage-caption{font:400 11px/1.6 var(--cr-font-mono);color:var(--cr-muted);margin-top:12px;text-align:center}.studio-index{display:flex;align-items:center;gap:22px;padding:21px 0;border-top:1px solid var(--studio-line);border-bottom:1px solid var(--studio-line);font-size:12px}.studio-index>span:first-child{margin-right:auto;color:var(--cr-muted)}.studio-index a{text-decoration:none;font-weight:600}.studio-index>span[aria-hidden]{color:var(--cr-border-strong)}
.studio-section{padding:64px 0 0}.studio-section-head{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:28px}.studio-section-head h2,.studio-playground h2,.studio-about-row h2{font-size:clamp(26px,2.8vw,36px);line-height:1.16;font-weight:600;letter-spacing:-.04em;max-width:24ch;margin:0}.studio-section-head .studio-eyebrow{margin-bottom:13px}.studio-section-head>p{font-size:13px;color:var(--cr-muted);max-width:30ch;margin-bottom:2px}.studio-link{display:inline-flex;align-items:center;gap:16px;min-height:36px;font-size:13px;font-weight:600;text-decoration:none!important;border-bottom:1px solid var(--cr-border-strong)}.studio-link:hover{color:var(--cr-brand);border-color:var(--cr-brand)}.studio-tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.studio-tool{text-decoration:none;border:1px solid var(--studio-line);border-radius:9px;overflow:hidden;background:var(--cr-surface);padding:10px 10px 20px;transition:border-color .15s,transform .15s}.studio-tool:hover{border-color:var(--cr-brand);transform:translateY(-3px)}.studio-tool-art{height:122px;background:#eeeef1;display:flex;position:relative;overflow:hidden;border-radius:4px;justify-content:center;align-items:center;gap:5px}.studio-tool-caption{display:flex;gap:10px;align-items:center;margin:19px 10px 7px}.studio-tool-caption h3{font-size:16px;font-weight:650;letter-spacing:-.02em;margin:0}.studio-tool-caption>span:last-child{margin-left:auto}.studio-number{color:var(--cr-muted);font:400 10px var(--cr-font-mono)}.studio-tool>p{font-size:13px;color:var(--cr-muted);margin:0 10px;max-width:34ch;line-height:1.55}.art-stripes{background:#eaecf7;gap:0}.art-stripes i{width:38px;height:84px;background:#202a44;transform:rotate(-12deg)}.art-stripes i:nth-child(2){background:#5260e8}.art-stripes i:nth-child(3){background:#bac7ed}.art-stripes i:nth-child(4){background:#f0d9ca}.art-stripes i:nth-child(5){background:#e6af6d}.art-mix{background:#f6eadf}.art-mix i{width:80px;height:80px;border-radius:50%;background:#f09b69;margin:0 -10px}.art-mix i:nth-child(2){background:#818acb;mix-blend-mode:multiply}.art-mix i:nth-child(n+3){display:none}.art-contrast{background:#e8ecdf;gap:0}.art-contrast::before,.art-contrast::after{content:'Aa';font:54px var(--studio-serif);padding:8px 20px;border-radius:5px}.art-contrast::before{background:#253629;color:#f2f4da;transform:rotate(-5deg)}.art-contrast::after{background:#f2f4da;color:#253629;transform:rotate(5deg)}.art-contrast i{display:none}.art-image{background:#e4ece5;align-items:end}.art-image::before{content:'';position:absolute;width:200px;height:200px;border-radius:50%;top:45px;background:#718978;transform:skew(-20deg)}.art-image::after{content:'';position:absolute;width:50px;height:50px;border-radius:50%;top:18px;left:62%;background:#f1ca85}.art-image i{position:relative;width:28px;height:30px;background:#254c3c;z-index:1;margin-bottom:10px;border:2px solid #fff}.art-image i:nth-child(2){background:#718978}.art-image i:nth-child(3){background:#b2c2ae}.art-image i:nth-child(4){background:#f1ca85}.art-image i:nth-child(5){background:#e4ece5}.art-gradient{background:linear-gradient(110deg,#bcc6f4,#dbb7c9 53%,#edb67b)}.art-gradient::after{content:'110°';position:absolute;bottom:14px;right:16px;font:12px var(--cr-font-mono);color:#3f3441}.art-gradient i{display:none}.art-preview{background:#e9e9f4;padding:25px 35px;align-items:start;gap:8px}.art-preview::before{content:'';position:absolute;width:70%;height:90px;top:20px;background:#fff;border-radius:6px}.art-preview i{background:#e9ecfa;width:25%;height:35px;z-index:1;margin-top:30px;border-radius:3px}.art-preview i:first-child{height:13px;width:44%;position:absolute;top:3px;left:19%;margin-top:30px;background:#5965d9}.art-preview i:nth-child(n+4){display:none}.studio-more-tools{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px;padding:20px 0;border-bottom:1px solid var(--studio-line)}.studio-more-tools>span{font-size:12px;color:var(--cr-muted);padding-block:10px}.studio-more-tools a{font-size:12px;text-decoration:none;display:flex;align-items:center;gap:12px;min-height:36px}.studio-more-tools a:hover{color:var(--cr-brand)}
.studio-palette-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.studio-palette-strip{display:flex;height:140px;border-radius:7px;overflow:hidden;border:1px solid var(--cr-border)}.studio-palette-strip span{flex:1}.studio-palette h3{margin:15px 0 5px;font-size:16px;font-weight:600}.studio-palette h3 a{display:flex;justify-content:space-between;text-decoration:none}.studio-palette p{font-size:13px;color:var(--cr-muted);margin:0;line-height:1.5}.studio-hex-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.studio-hex-list button{background:none;border:0;padding:8px 2px;min-height:32px;font:9px var(--cr-font-mono);color:var(--cr-muted)}.studio-hex-list button:hover{text-decoration:underline;color:var(--cr-brand)}.studio-collection-links{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:24px}.studio-collection-links>span{font-size:12px;color:var(--cr-muted);margin-right:10px}.studio-collection-links a{padding:8px 14px;min-height:36px;border:1px solid var(--cr-border);border-radius:30px;font-size:12px;text-decoration:none}.studio-collection-links a:hover{border-color:var(--cr-brand)}
.studio-playground{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;border:1px solid var(--studio-line);border-radius:10px;margin-top:68px;padding:38px;background:var(--cr-surface-soft)}.studio-playground-copy>p:not(.studio-eyebrow){font-size:14px;color:var(--cr-ink-soft);margin:16px 0 20px}.studio-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.studio-actions .cr-btn{font-size:12px}.studio-playground .cr-home-role-list{display:grid;gap:0;margin-bottom:20px}.studio-playground .cr-home-role-row{padding:5px 0;border:0;background:none;border-radius:0;font-size:11px;grid-template-columns:12px 1fr auto}.studio-playground .cr-home-role-row code{font-size:10px}.studio-playground .cr-home-role-dot{width:9px;height:9px;border-radius:50%}.studio-playground .cr-home-role-row strong{font-weight:500}.studio-preview-wrap{display:flex;align-items:center}.studio-preview-wrap .cr-home-preview{width:100%;min-height:350px;border-radius:7px;box-shadow:0 12px 24px #00000012}.studio-preview-wrap h3{font-size:32px!important}.studio-preview-wrap .cr-home-preview-body{padding:24px!important}.studio-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--studio-line);border-bottom:1px solid var(--studio-line)}.studio-guide{display:flex;flex-direction:column;text-decoration:none;padding:26px 26px 26px 0}.studio-guide+.studio-guide{border-left:1px solid var(--studio-line);padding-left:26px}.studio-guide>span{font:500 10px var(--cr-font-mono);color:var(--cr-muted);letter-spacing:.05em}.studio-guide h3{font-size:23px;line-height:1.2;font-weight:550;letter-spacing:-.035em;margin:22px 0 10px;max-width:18ch}.studio-guide p{font-size:13px;color:var(--cr-muted);margin:0 0 23px}.studio-guide>strong{font-size:12px;font-weight:600;margin-top:auto}.studio-guide>strong span{margin-left:15px}.studio-guide:hover h3{color:var(--cr-brand)}.studio-about-row{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:60px 0;border-bottom:1px solid var(--studio-line)}.studio-about-row p:not(.studio-eyebrow){font-size:14px;color:var(--cr-ink-soft);margin:0 0 14px}.studio-faq{display:grid;grid-template-columns:.7fr 1.3fr;gap:50px;padding:48px 0}.studio-faq h2{font-size:28px;font-weight:550;letter-spacing:-.04em}.studio-faq details{border-bottom:1px solid var(--studio-line);padding:0}.studio-faq summary{font-size:14px;font-weight:600;padding:18px 2px;cursor:pointer}.studio-faq p{font-size:13px;color:var(--cr-muted);padding-bottom:20px}.studio-final{display:flex;align-items:center;gap:20px;padding:25px;border-radius:7px;background:var(--cr-surface-soft)}.studio-final>span{font:italic 27px var(--studio-serif);margin-right:auto}.studio-final .cr-btn{font-size:13px}
/* Guides and trust: readable pages, visible contents, concrete examples. */
.guide-wrap{max-width:1120px;margin:auto}.guide-hero{box-shadow:none;border-radius:0;border:0;border-bottom:1px solid var(--cr-border);background:none;padding:20px 0 32px}.guide-hero:after{content:none}.guide-kicker{padding:0;border:0;background:none;border-radius:0;font:500 11px var(--cr-font-mono);color:var(--cr-muted)}.guide-title{max-width:850px;font-weight:600}.guide-deck{max-width:750px;font-size:17px;color:var(--cr-ink-soft)}.guide-meta span{border:0;background:none;padding:0;border-radius:0;font-size:11px;font-weight:500}.guide-meta{gap:18px;margin-top:22px}.guide-author{background:none!important;border:0!important;padding:20px 0 0!important}.guide-author-mark{background:var(--cr-brand)!important;color:var(--cr-brand-contrast)!important;border-radius:4px!important}.guide-author p{font-size:12px!important}.guide-layout{grid-template-columns:minmax(0,1fr) 240px;gap:50px}.guide-article{border:0;border-radius:0;background:none;box-shadow:none;padding:0}.guide-article p,.guide-article li{font-size:16px;line-height:1.8;color:var(--cr-ink-soft)}.guide-article h2{font-size:26px;font-weight:600;margin-top:40px}.guide-toc{border:0;border-left:1px solid var(--cr-border);border-radius:0;box-shadow:none;background:none;padding:0 0 0 20px}.guide-toc a{font-size:12px;font-weight:450;padding:7px}.guide-toc>strong{font-size:11px;text-transform:uppercase;letter-spacing:.07em}.guide-card{border-radius:8px;box-shadow:none;min-height:240px;padding:24px}.guide-card:before{height:3px;background:var(--cr-brand)}.guide-card:hover{transform:translateY(-2px);box-shadow:none}.guide-card-icon{display:none}.guide-filter{border-radius:5px;font-weight:550}.guide-checklist,.guide-example{border-radius:6px;box-shadow:none;background:var(--cr-surface-soft)}.guide-related-card{box-shadow:none!important;border-radius:6px!important}.guide-table-wrap{max-width:100%;overflow:auto}.trust-hero,.trust-hero--compact{padding-block:20px!important;background:none!important;border:0!important;box-shadow:none!important}.trust-card{box-shadow:none!important;border-radius:8px!important}.trust-hero h1{margin-top:10px}.trust-prose p,.trust-prose li{font-size:15px;line-height:1.8}.trust-eyebrow{color:var(--cr-brand)}.trust-grid{gap:20px}.trust-wide{max-width:100%}.trust-email a{overflow-wrap:anywhere}.studio-example{margin:30px 0;padding:24px;border:1px solid var(--cr-border);border-radius:8px;background:var(--cr-surface)}.studio-example h2{margin-top:0;font-size:24px}.studio-example .studio-eyebrow{font-size:10px}.studio-example p{font-size:14px}.studio-example-swatches{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-radius:5px;overflow:hidden;margin:18px 0}.studio-example-swatches span{min-height:80px;display:flex;align-items:end;padding:8px 5px;font:10px var(--cr-font-mono);color:var(--swatch-ink);background:var(--swatch-color)}.studio-example table{width:100%;border-collapse:collapse;font-size:13px}.studio-example th,.studio-example td{padding:11px 8px;text-align:left;border-bottom:1px solid var(--cr-border);line-height:1.5}.studio-example a.cr-btn{font-size:12px;margin-top:14px}.studio-example pre{background:var(--cr-surface-soft);padding:15px;font-size:12px}.studio-example caption{text-align:left;font-size:12px;color:var(--cr-muted);margin-bottom:10px}.studio-contrast-demo{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.studio-contrast-demo span{padding:16px 24px;background:var(--demo-bg);color:var(--demo-ink);border:1px solid var(--cr-border);font-weight:650}
/* Collection cards remain useful when the live catalogue is slow or unavailable. */
.palette-seo-intro{background:none!important;box-shadow:none!important;border:0!important;padding:0!important;max-width:850px}.palette-seo-intro p{font-size:16px}.palette-seo-content{box-shadow:none!important;border-radius:8px!important}.static-palette-card{background:var(--cr-surface)!important;border-radius:8px!important;box-shadow:none}.static-swatches span{color:var(--swatch-ink,#111)!important;text-shadow:none!important;font:10px var(--cr-font-mono);padding:9px 3px}.studio-palette-actions{display:flex;gap:10px;flex-wrap:wrap;padding:0 16px 16px}.studio-palette-actions a{font-size:12px;text-underline-offset:3px;min-height:32px;display:inline-flex;align-items:center}.studio-pair-note{padding:0 16px 16px;font-size:12px;color:var(--cr-muted);line-height:1.6}.cr-palette-card{box-shadow:none!important;border-radius:8px!important}.cr-palette-card .cr-palette-card-description{font-size:12px}.cr-explore-hero{padding-top:20px!important}.cr-explore-toolbar{box-shadow:none!important;border-radius:8px!important}.cr-explore-quick-filter{font-weight:550}.cr-explore-state{padding:28px!important}.explore-count-badge{white-space:normal;font-weight:500}.feed-status{font-size:12px}.studio-starters{padding:24px 0;margin:0 0 32px;border-bottom:1px solid var(--cr-border)}.studio-starters h2{font-size:23px;margin:0 0 10px}.studio-starters>p{font-size:14px;color:var(--cr-muted);max-width:65ch}.studio-starters .studio-palette-grid{margin-top:20px}.studio-noscript{padding:20px;text-align:center;color:var(--cr-ink-soft);font-size:14px}.studio-privacy-status{font-size:14px;margin:12px 0;color:var(--cr-ink-soft)}
/* Compact privacy controls, equal choice emphasis. */
.cookie-consent{max-width:760px!important;border:1px solid var(--cr-border)!important;border-radius:8px!important;background:var(--cr-surface)!important;box-shadow:0 8px 40px #0002!important;backdrop-filter:none!important;padding:18px!important}.cookie-consent p,.cookie-consent span{color:var(--cr-ink-soft)!important;font-size:12px!important;font-weight:450!important;line-height:1.5!important}.cookie-consent strong{color:var(--cr-ink)!important;font-size:14px!important}.cookie-consent button{min-height:44px!important;border-radius:5px!important;font-size:12px!important;background:var(--cr-surface)!important;color:var(--cr-ink)!important;border:1px solid var(--cr-border-strong)!important;box-shadow:none!important}.cookie-consent a{color:inherit;text-decoration:underline}
@media(max-width:1000px){.studio-hero{gap:28px;padding-block:48px}.studio-hero h1{font-size:48px}.studio-hero .cr-home-swatch-grid{min-height:285px}.studio-playground{gap:25px;padding:25px}.studio-preview-wrap .cr-home-preview{min-height:310px}.studio-tool-grid{gap:14px}.guide-layout{gap:28px}.studio-hero .cr-home-hero-toolbar .cr-btn{font-size:11px}}
@media(max-width:960px){.cr-header-inner{min-height:64px}.guide-layout{grid-template-columns:1fr}.guide-sidebar{order:-1;position:static}.guide-toc{display:block;max-height:180px;overflow:auto;padding:15px;border:1px solid var(--cr-border);border-radius:5px;margin-bottom:5px}.guide-reading{display:none}.guide-toc a{font-size:13px}.studio-playground{grid-template-columns:1fr 1fr}.studio-hero h1{font-size:44px}}
@media(max-width:720px){.cr-home.page{padding-inline:20px}.studio-hero{grid-template-columns:1fr;padding:38px 0 32px;gap:32px}.studio-hero-copy{max-width:500px}.studio-hero h1{font-size:clamp(44px,9.5vw,62px);max-width:15ch;margin-bottom:18px}.studio-lede{font-size:16px}.studio-fine{font-size:11px}.studio-hero .cr-home-swatch-grid{min-height:240px;grid-template-columns:repeat(5,minmax(0,1fr))}.studio-hero .cr-home-swatch{min-height:0;padding:7px 3px}.studio-hero .cr-home-hex-button{font-size:10px}.studio-hero .cr-home-lock-button{font-size:10px;min-height:36px}.studio-hero .cr-home-hero-toolbar .cr-btn{font-size:12px}.studio-hero .cr-home-shortcut{display:none}.studio-hero .cr-home-text-link{grid-column:1/-1;justify-self:center}.studio-index{gap:14px;flex-wrap:wrap;justify-content:center;font-size:12px;padding:16px 0}.studio-index>span:first-child{flex:1 0 100%;text-align:center;margin:0}.studio-section{padding-top:42px}.studio-section-head{display:block;margin-bottom:22px}.studio-section-head>p{margin-top:15px;max-width:none}.studio-section-head>.studio-link{margin-top:15px}.studio-section-head h2{font-size:28px}.studio-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.studio-tool-art{height:100px}.studio-tool{padding:7px 7px 16px}.studio-tool-caption{margin:14px 4px 7px;gap:7px;align-items:start}.studio-tool-caption h3{font-size:14px}.studio-number{display:none}.studio-tool>p{font-size:12px;margin-inline:4px}.studio-more-tools{gap:4px 20px}.studio-more-tools a{min-height:40px}.studio-more-tools>span{width:100%;padding-bottom:0}.studio-palette-grid{grid-template-columns:1fr;gap:26px}.studio-palette-strip{height:145px}.studio-hex-list{gap:10px}.studio-hex-list button{font-size:11px;min-height:36px}.studio-playground{grid-template-columns:1fr;padding:24px;margin-top:42px}.studio-preview-wrap .cr-home-preview{min-height:320px}.studio-guide-grid{grid-template-columns:1fr}.studio-guide{padding:24px 0}.studio-guide+.studio-guide{border-left:0;border-top:1px solid var(--cr-border);padding:24px 0}.studio-guide h3{margin:14px 0 9px;max-width:none;font-size:25px}.studio-guide p{margin-bottom:15px;max-width:40ch}.studio-about-row{grid-template-columns:1fr;gap:22px;padding-block:42px}.studio-faq{grid-template-columns:1fr;gap:12px;padding-block:32px}.studio-faq summary{font-size:13px}.studio-final{flex-wrap:wrap;gap:12px;padding:20px}.studio-final>span{width:100%}.studio-final .studio-link{font-size:12px}.cr-site-footer{margin-top:40px}.cr-footer-inner{gap:24px}.cr-footer-link{font-size:12px;min-height:32px}.guide-wrap{width:calc(100% - 40px);padding-top:20px}.guide-hero{padding:10px 0 24px}.guide-deck{font-size:15px}.guide-article h2{font-size:23px}.guide-article p,.guide-article li{font-size:15px}.guide-meta{gap:8px 15px}.studio-example{padding:18px}.studio-example-swatches span{min-height:75px;font-size:9px}.studio-example th,.studio-example td{font-size:12px;padding:9px 5px}.studio-example table{display:block;overflow:auto}.studio-contrast-demo{flex-direction:column}.cookie-consent{width:calc(100% - 24px)!important;bottom:12px!important;max-height:48vh;overflow:auto;padding:14px!important}.cookie-consent.show{display:flex!important;flex-direction:column;align-items:stretch!important;gap:12px!important}.cookie-actions{width:100%;display:flex}.cookie-actions button{flex:1}.cr-mix-controls,.cr-mix-results,.cr-mix-compare{padding:18px}.cr-mix-result-preview{min-height:230px}.cr-mix-mode-grid{grid-template-columns:1fr 1fr}.cr-mix-path-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.cr-mix-path-swatch{min-height:90px;padding:7px 2px;align-items:center}.cr-mix-path-swatch strong{font-size:9px}.cr-mix-path-swatch span{font-size:9px}.cr-mix-method-label{flex-wrap:wrap;gap:5px}.trust-prose p,.trust-prose li{font-size:14px}.static-palette-grid{grid-template-columns:1fr!important}.cr-generator-shortcut{display:none!important}}
@media(max-width:360px){.cr-home.page{padding-inline:16px}.studio-tool-grid{grid-template-columns:1fr}.studio-hero .cr-home-hex-button{font-size:9px}.studio-hero h1{font-size:43px}.studio-example-swatches{grid-template-columns:1fr}.studio-example-swatches span{min-height:36px}.cr-mix-mode-grid{grid-template-columns:1fr}.studio-hero-cta{font-size:12px;padding-inline:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.studio-tool:hover{transform:none}}
@media(forced-colors:active){.cr-brand-mark{border:1px solid CanvasText}.studio-tool,.cr-btn{border:1px solid ButtonText}.static-swatches span{forced-color-adjust:none}.studio-privacy-button{color:LinkText}}

/* Preserve button contrast against inherited homepage link styles. */
#home a.cr-btn--primary{color:var(--cr-brand-contrast)}

/* Text on variable color swatches must retain the measured ink contrast. */
:root{--cr-accent:var(--cr-brand)}
.studio-hero .cr-home-lock-button,.cr-home-preview-label,.cr-mix-result-meta span,.cr-mix-result-detail span,.cr-mix-result-main p,.cr-mix-result-detail code,.cr-mix-path-swatch span,.cr-mix-compare-card span,.cr-mix-compare-card small,.cr-ts-swatch span{opacity:1;color:inherit}
.cr-converter-preview-badge{background:#20242c!important;color:#fff!important;backdrop-filter:none}
.cr-converter-preview-badge span:first-child{opacity:1}

/* Render exact calculated colors and theme changes without intermediate colors. */
body,body.dark,.cr-site-header,.cr-mix-result-preview,.cr-home-preview-body,.cr-home-preview-card{transition:none!important}
.viz-feature-grid>article>span{color:var(--viz-text);border-left:3px solid var(--viz-accent);padding-left:8px}
body,body.dark{--studio-line:var(--cr-border)}
.studio-hero .cr-home-swatch-actions{grid-template-columns:minmax(0,1fr)}

/* Theme colors change together; motion is reserved for position and elevation. */
.cr-btn,.cr-icon-btn,.cr-nav-link,.guide-card,.links a{transition-property:transform,box-shadow!important}
button,a,input,select,textarea{transition-property:transform,opacity,box-shadow!important}
body.dark .cr-btn--danger{color:var(--cr-canvas)}
.studio-contrast-demo figure{margin:0;display:grid;gap:8px;flex:1}
.studio-contrast-demo figcaption{font-size:12px;font-weight:600;color:var(--cr-ink)}
.studio-contrast-sample{width:100%;height:auto;display:block;background:#fff;border:1px solid var(--cr-border);border-radius:4px}
