.purple-background-page{--navy: #28173d;--coral: #7134a1;--purple-accent: #7134a1;--purple-canvas: #f5f0fa;--content-gutter: max(24px, calc((100vw - 1120px)/2) );color:var(--navy);background:#fff;font-family:Manrope,Arial,sans-serif}.purple-background-page :is(h1,h2,h3){text-wrap:balance}.purple-background-page :is(a,button,input,summary):focus-visible{outline:3px solid #7134a1;outline-offset:4px}.purple-background-page .tool-section{--tool-section-gutter: var(--content-gutter)}.purple-background-page .ad-banner{max-width:100%;overflow:hidden}.purple-hero{padding:54px 24px 46px;background:var(--purple-canvas)}.purple-hero__copy{max-width:960px;margin-inline:auto;text-align:center}.purple-assurances{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 24px;margin:0 0 22px;color:var(--purple-accent);font-size:12px;font-weight:600}.purple-assurances span:before{content:"✓";margin-inline-end:7px}.purple-hero h1{max-width:900px;margin:0 auto 22px;font:650 clamp(36px,4.4vw,62px)/1.06 "Bricolage Grotesque",Arial,sans-serif;letter-spacing:-.05em}.purple-hero__intro{max-width:810px;margin:0 auto 32px;color:#655d70;font-size:15px;line-height:1.75}.purple-studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;max-width:1120px;margin:auto;padding:12px;border:1px solid #ded1eb;border-radius:20px;background:#fff}.purple-studio__example{display:flex;flex-direction:column;justify-content:center;min-width:0;margin:0;overflow:hidden;border-radius:12px;background:purple}.purple-studio__photo{display:grid;flex:1;min-height:300px;place-items:center}.purple-studio__photo img{display:block;width:100%;height:100%;max-height:320px;object-fit:contain}.purple-studio__example figcaption{padding:18px 20px;border-top:1px solid #28173d26;background:#faf7fd}.purple-studio__example figcaption>span{display:block;margin-bottom:12px;font:550 17px/1.4 Bricolage Grotesque,Arial,sans-serif}.purple-studio__swatches{display:flex;flex-wrap:wrap;gap:12px 18px}.purple-studio__swatches>button{display:inline-flex;align-items:center;gap:7px;font-size:11px}.purple-studio__swatches i{width:16px;height:16px;border:1px solid #28173d33;border-radius:50%}.purple-workboard{display:flex;min-width:0}.purple-background-page .purple-workboard .workspace{width:100%;scroll-margin-top:100px;border:0;border-radius:12px;background:#28173d;color:#fff;box-shadow:none}.purple-background-page .purple-workboard .workspace.empty{min-height:380px;padding:28px 24px}.purple-background-page .purple-workboard .workspace.empty.is-dragging{background:#42235c;outline-color:#e6d5fa}.purple-background-page .purple-workboard .workspace h2{max-width:440px;font:550 clamp(24px,2.8vw,32px)/1.15 "Bricolage Grotesque",Arial,sans-serif;letter-spacing:-.035em}.purple-background-page .purple-workboard .workspace-kicker{margin:0;color:#d8c8e8;font:500 11px/1.5 DM Mono,monospace}.purple-background-page .purple-workboard .workspace-privacy-link{margin-top:12px;color:#d8c8e8;font-size:11px;text-decoration:underline;text-underline-offset:3px}.purple-background-page .purple-workboard .scanner-icon{width:48px;height:48px;margin-bottom:10px}.purple-background-page .purple-workboard .scanner-icon b{width:18px;height:18px;border-color:#d8c8e8}.purple-background-page .purple-workboard .scanner-icon span{top:24px;left:13px;width:23px;background:#d8c8e8}.purple-background-page .purple-workboard :is(.upload-button,.remove-button,.download-button){border-radius:8px;padding:14px 22px;color:#28173d;background:#e6d5fa;font-weight:700;box-shadow:none}.purple-background-page .purple-workboard :is(.upload-button,.remove-button,.download-button):hover:not(:disabled){background:#dac0f5}.purple-background-page .purple-workboard :is(button,input,a):focus-visible{outline-color:#e6d5fa}.purple-background-page .purple-workboard :is(.workspace-topline button,.quiet-button){color:#e6d5fa}.purple-background-page .purple-workboard .workspace-note{color:#d8c8e8;line-height:1.6;text-align:center}.purple-background-page .purple-workboard .workspace.active{padding:18px}.purple-background-page .purple-workboard .image-stage{height:230px;gap:6px;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr)}.purple-background-page .purple-workboard .image-pane.original{background:#f5f0fa}.purple-background-page .purple-workboard .file-meta strong{color:#fff}.purple-background-page .purple-workboard .file-meta span{color:#d8c8e8;line-height:1.6}.purple-background-page .purple-workboard .workspace-actions{flex-wrap:wrap;gap:12px}.purple-background-page .purple-workboard .file-meta{flex-basis:100%;min-width:0;overflow-wrap:anywhere}.purple-background-page .purple-workboard .workspace-background{grid-template-columns:minmax(0,1fr);color:#fff;border-color:#ffffff30;gap:16px}.purple-background-page .purple-workboard .workspace-background>div{grid-column:1}.purple-background-page .purple-workboard .workspace-background>div:first-child p{color:#d8c8e8}.purple-background-page .purple-workboard .workspace-background>div:first-child strong{color:#fff}.purple-background-page .purple-workboard .background-choice-group button.is-active{color:#28173d;border-color:purple;background:#f5f0fa}.purple-background-page .purple-workboard .custom-color-picker:has(.custom-color-popover){display:block;padding:12px}.purple-background-page .purple-workboard .custom-color-control:has(.custom-color-popover){width:100%}.purple-background-page .purple-workboard .custom-color-control:has(.custom-color-popover) .custom-color-chip{margin-inline-start:auto}.purple-background-page .purple-workboard .custom-color-popover{position:static;width:100%;margin-top:10px;box-shadow:none}.purple-background-page .purple-workboard .custom-color-popover :is(input,button):focus-visible{outline-color:#7134a1}.purple-background-page .comparison-input{direction:ltr}.purple-background-page .image-text-comparison{padding-block:80px;gap:64px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.purple-background-page .image-text-comparison h2{font-size:clamp(32px,3.4vw,46px);font-weight:600;line-height:1.1;letter-spacing:-.04em}.purple-background-page .image-text-comparison p{color:#655d70;font-size:15px;line-height:1.8}.purple-background-page .image-text-comparison--reversed{background:var(--purple-canvas)}.purple-background-page .image-text-comparison :is(.image-text-comparison--compact__visual,.image-text-comparison--reversed__visual,.image-text-comparison--tall__visual){width:100%;max-width:520px;min-width:0;justify-self:center;border-radius:12px;box-shadow:none}.purple-background-page .comparison-label{font-size:9px}.purple-background-page .comparison-stage.is-focused{outline-color:#7134a1}.purple-background-page .color-samples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.purple-background-page .color-sample{min-width:0;margin:0;overflow:hidden;border:1px solid #28173d15;border-radius:10px;background:#fff}.purple-background-page .color-sample>div{aspect-ratio:1}.purple-background-page .color-sample:first-child{grid-column:1 / -1}.purple-background-page .color-sample:first-child>div{aspect-ratio:2 / 1}.purple-background-page .color-sample img{display:block;width:100%;height:100%;object-fit:contain}.purple-background-page .color-sample figcaption{display:grid;gap:5px;padding:12px 14px;font-size:13px}.purple-background-page .color-sample small{color:#655d70;font:10px/1.5 DM Mono,monospace}.purple-workflow{padding-bottom:66px}.purple-background-page .purple-workflow .seo-workflow{padding-bottom:24px}.purple-background-page .seo-workflow-grid{list-style:none}.purple-background-page .workflow-explanation{margin:14px auto 0;color:#655d70;font-size:14px;line-height:1.7}.purple-workflow__action{padding-inline:var(--content-gutter);text-align:center}.purple-workflow__action a{display:inline-flex;gap:8px;padding:14px 24px;border-radius:8px;color:#fff;background:var(--purple-accent);font-size:14px;font-weight:600}.purple-background-page .why-section{--why-background: #f5f0fa}.purple-background-page .why-section__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 36px}.purple-background-page .why-section__image{border-radius:10px;box-shadow:none;background:#f5f0fa}.purple-background-page .why-section__card h3{font-size:23px}.purple-background-page .audience-tabs{background:#fff}.purple-background-page .audience-tabs__tabs{max-width:1040px;margin-block:38px 48px;background:#f5f0fa}.purple-background-page .audience-tabs__tabs .is-active{color:#fff;background:var(--purple-accent)}.purple-background-page .audience-tabs__visual{min-height:0;aspect-ratio:4 / 3;box-shadow:none;background:#e6e6fa}.purple-background-page .audience-tabs__visual img{width:100%;height:100%;min-height:0;object-fit:cover;object-position:center}.purple-background-page #purple-audience-personal .audience-tabs__visual{background:#e6e6fa}.purple-background-page #purple-audience-sellers .audience-tabs__visual,.purple-background-page #purple-audience-teams .audience-tabs__visual{background:#e0c9ee}.purple-background-page #purple-audience-creators .audience-tabs__visual{background:#e6e6fa}.purple-background-page .audience-tabs__copy>a{border-radius:8px;background:var(--purple-accent);box-shadow:none}.purple-background-page .preview-close{background:var(--navy)}.purple-background-page .tool-section.preview-close>div>a{border-radius:8px;color:var(--navy);background:#e6d5fa}@media(min-width:901px){.purple-background-page .preview-close{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;padding-inline:var(--content-gutter)}.purple-background-page .preview-close>div{max-width:none}}@media(max-width:1100px){.purple-background-page{--content-gutter: 40px}.purple-background-page .image-text-comparison{gap:36px}.purple-background-page .audience-tabs__tabs{flex-wrap:wrap;border-radius:12px}}@media(max-width:860px){.purple-studio{grid-template-columns:1fr;max-width:660px}.purple-workboard{order:-1}.purple-studio__photo{min-height:200px}.purple-studio__photo img{max-height:220px}.purple-background-page .image-text-comparison{grid-template-columns:1fr}}@media(max-width:760px){.purple-background-page{--content-gutter: 24px}.purple-hero{padding:36px 16px 28px}.purple-hero__intro{font-size:14px}.purple-background-page .image-text-comparison{padding-block:54px}.purple-background-page .purple-workboard .workspace.empty{min-height:300px}}@media(max-width:540px){.purple-hero h1{font-size:36px}.purple-studio{padding:6px;border-radius:15px}.purple-background-page .purple-workboard .workspace.active{padding:12px}.purple-background-page .why-section__grid{grid-template-columns:1fr;gap:32px}.purple-background-page .audience-tabs__tabs{width:100%;margin-inline:0}.purple-background-page .audience-tabs__tabs button{white-space:normal;max-width:100%}.purple-background-page .color-sample figcaption{padding:10px}.purple-workflow__action a{max-width:100%}}@media(prefers-reduced-motion:reduce){html:has(.purple-background-page){scroll-behavior:auto}.purple-background-page *,.purple-background-page *:before,.purple-background-page *:after{transition:none!important;animation:none!important}}.purple-studio__swatches>button{padding:7px 9px;border:1px solid transparent;border-radius:7px;background:transparent;color:#28173d}.purple-studio__swatches>button:hover{background:#ece0f7}.purple-studio__swatches>button[aria-pressed=true]{border-color:#7134a1;background:#ece0f7}.purple-studio__color{margin:0 0 12px;color:#655d70;font:11px/1.5 DM Mono,monospace}.purple-studio__photo{transition:background-color .18s ease}.purple-background-page .image-text-comparison a[id$=-cta]{display:inline-flex;align-items:center;gap:10px;max-width:100%;min-height:44px;margin-top:22px;padding:12px 20px;border-radius:8px;background:#7134a1;color:#fff;box-shadow:none;font-size:14px;line-height:1.5;text-decoration:none}.purple-background-page .image-text-comparison a[id$=-cta]:hover{background:#57237d;color:#fff}.purple-background-page .audience-tabs__visual{display:grid;grid-template-columns:1fr 1fr}.purple-background-page .audience-tabs__visual--single{grid-template-columns:minmax(0,1fr)}.purple-background-page .audience-tabs__visual img{object-fit:contain}.purple-background-page .audience-tabs__visual img:first-child{background:#f5f0fa}.purple-background-page .tool-section p{overflow-wrap:break-word}html[lang=ja-JP] .purple-background-page{line-break:strict}.purple-background-page .workflow-card--01{background:#f5f0fa;border-color:#ded1eb}.purple-studio__note{margin:12px 0 0;color:#655d70;font-size:11px;line-height:1.6}.purple-background-page .why-section__image{background:#e6e6fa}.purple-background-page .why-section__color-variant span{background:#fff;color:#28173d;padding:8px 3px}.purple-background-page .audience-tabs__visual img:first-child{background:transparent}.purple-background-page #purple-audience-creators .audience-tabs__visual{background:purple}.purple-background-page #purple-audience-designers .audience-tabs__visual{background:#673147}.purple-background-page .audience-tabs__visual img{padding:20px}.purple-background-page .why-section__image>img{padding:20px}.purple-background-page .why-section__image--variants img{padding:10px 4px}.purple-studio__photo{background:purple}.purple-background-page :is(#purple-why-title-card-1,#purple-why-title-card-2,#purple-why-title-card-4) .why-section__image>img{padding:0;object-fit:cover}.purple-background-page .why-section__color-variant img{padding:0;object-fit:cover;object-position:center 15%}.purple-background-page :is(#purple-audience-personal,#purple-audience-sellers,#purple-audience-creators,#purple-audience-designers) .audience-tabs__visual img{padding:0;object-fit:cover}@media(min-width:1121px)and (max-width:1600px){html:is([lang=nl],[lang=pl],[lang=zh-CN],[lang=zh-Hant-TW],[lang=ar]):has(.purple-background-page) body header.site-header{--header-gutter: 24px}html:is([lang=nl],[lang=pl],[lang=zh-CN],[lang=zh-Hant-TW],[lang=ar]):has(.purple-background-page) .site-header .site-nav{gap:14px}html:is([lang=nl],[lang=pl],[lang=zh-CN],[lang=zh-Hant-TW],[lang=ar]):has(.purple-background-page) .auth-entry-desktop{gap:12px}html:is([lang=nl],[lang=pl],[lang=zh-CN],[lang=zh-Hant-TW],[lang=ar]):has(.purple-background-page) .auth-entry-desktop>:is(button,a){font-size:13px;padding-inline:12px}html:is([lang=nl],[lang=pl],[lang=zh-CN],[lang=zh-Hant-TW],[lang=ar]):has(.purple-background-page) .auth-entry-desktop>.auth-entry-login{padding-inline:0}}html:is([lang=zh-CN],[lang=zh-Hant-TW],[lang=ar],[lang=ja-JP],[lang=ko]):has(.purple-background-page) .site-header :is(.site-nav>a,.blog-nav-menu__trigger,.locale-switcher>summary){white-space:nowrap}@media(min-width:1121px)and (max-width:1200px){html[lang=ar]:has(.purple-background-page) .site-header .site-nav{gap:8px}html[lang=ar]:has(.purple-background-page) .auth-entry-desktop{gap:8px;margin-inline-start:0}}html[lang=th]:has(.purple-background-page) .site-header :is(.site-nav>a,.blog-nav-menu__trigger,.locale-switcher>summary){white-space:nowrap}@media(min-width:1121px)and (max-width:1600px){html[lang=th]:has(.purple-background-page) body header.site-header{--header-gutter: 24px}html[lang=th]:has(.purple-background-page) .site-header .site-nav{gap:8px}html[lang=th]:has(.purple-background-page) .auth-entry-desktop{gap:8px;margin-inline-start:0}html[lang=th]:has(.purple-background-page) .auth-entry-desktop>:is(button,a){font-size:13px;padding-inline:12px}html[lang=th]:has(.purple-background-page) .auth-entry-desktop>.auth-entry-login{padding-inline:0}}@media(min-width:1121px){html:is([lang=fr],[lang=pt-BR],[lang=es],[lang=de-DE],[lang=ja-JP],[lang=hi-IN],[lang=ko],[lang=id-ID],[lang=ru-RU],[lang=it],[lang=tr],[lang=vi],[lang=ms],[lang=uk],[lang=fil],[lang=cs]):has(.purple-background-page) body header.site-header{--header-gutter: max(24px, calc((100vw - 1536px)/2) )}html:is([lang=fr],[lang=pt-BR],[lang=es],[lang=de-DE],[lang=ja-JP],[lang=hi-IN],[lang=ko],[lang=id-ID],[lang=ru-RU],[lang=it],[lang=tr],[lang=vi],[lang=ms],[lang=uk],[lang=fil],[lang=cs]):has(.purple-background-page) .site-header .site-nav{gap:14px}html:is([lang=fr],[lang=pt-BR],[lang=es],[lang=de-DE],[lang=ja-JP],[lang=hi-IN],[lang=ko],[lang=id-ID],[lang=ru-RU],[lang=it],[lang=tr],[lang=vi],[lang=ms],[lang=uk],[lang=fil],[lang=cs]):has(.purple-background-page) .auth-entry-desktop{gap:12px}html:is([lang=fr],[lang=pt-BR],[lang=es],[lang=de-DE],[lang=ja-JP],[lang=hi-IN],[lang=ko],[lang=id-ID],[lang=ru-RU],[lang=it],[lang=tr],[lang=vi],[lang=ms],[lang=uk],[lang=fil],[lang=cs]):has(.purple-background-page) .auth-entry-desktop>:is(button,a){font-size:13px;padding-inline:12px}html:is([lang=fr],[lang=pt-BR],[lang=es],[lang=de-DE],[lang=ja-JP],[lang=hi-IN],[lang=ko],[lang=id-ID],[lang=ru-RU],[lang=it],[lang=tr],[lang=vi],[lang=ms],[lang=uk],[lang=fil],[lang=cs]):has(.purple-background-page) .auth-entry-desktop>.auth-entry-login{padding-inline:0}}@media(min-width:1121px)and (max-width:1200px){html:is([lang=fr],[lang=pt-BR],[lang=es],[lang=de-DE],[lang=ja-JP],[lang=hi-IN],[lang=ko],[lang=id-ID],[lang=ru-RU],[lang=it],[lang=tr],[lang=vi],[lang=ms],[lang=uk],[lang=fil],[lang=cs]):has(.purple-background-page) .site-header .site-nav{gap:8px}html:is([lang=fr],[lang=pt-BR],[lang=es],[lang=de-DE],[lang=ja-JP],[lang=hi-IN],[lang=ko],[lang=id-ID],[lang=ru-RU],[lang=it],[lang=tr],[lang=vi],[lang=ms],[lang=uk],[lang=fil],[lang=cs]):has(.purple-background-page) .auth-entry-desktop{gap:8px;margin-inline-start:0}}html[lang=ko] .purple-background-page{word-break:keep-all}
