/* Original transparent artwork, framed without its empty outer margins. */
html body .clofit-wordmark{display:block!important;position:relative!important;width:200px!important;max-width:100%!important;aspect-ratio:1550 / 375;height:auto!important;overflow:hidden!important;margin:16px auto 24px!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;flex:none!important;direction:ltr}
html body .clofit-wordmark>img{display:block!important;position:absolute!important;width:125.290323%!important;max-width:none!important;height:auto!important;left:-12.580645%!important;top:-52%!important;margin:0!important;padding:0!important;object-fit:contain!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;filter:none!important}
/* Use the supplied light-weight artwork; blend its paper into the themed surface. */
html body .clofit-wordmark{aspect-ratio:1900 / 360!important}
html body .clofit-wordmark>img{content:url('../images/clofit-color-logo-preview.png');width:111.21%!important;left:-5.9%!important;top:-49%!important;mix-blend-mode:multiply;filter:none!important}
html:root[data-theme="dark"] body .clofit-wordmark>img{content:url('../images/clofit-color-logo-preview.png');mix-blend-mode:screen;filter:none!important}
html body :is(#reel-settings-sheet,#merchant-settings-sheet,.account-menu) .clofit-wordmark{margin:28px auto 32px!important}
html body .clofit-wordmark--small{width:140px!important;margin:12px auto 20px!important}
html:root body .clofit-welcome>.clofit-wordmark{width:140px!important;margin:18px auto 12px!important}
html:root[data-theme="dark"] body :is(.clofit-welcome,.clofit-welcome-actions,.clofit-welcome-legal){background:#211c22!important;color:#faf6f8!important}
html:root[data-theme="dark"] body .clofit-welcome-legal a{color:inherit!important}
html:root[data-theme="dark"] body .clofit-welcome>video{background:#211c22!important}
html:root[data-theme="dark"] body:has(.clofit-legal-page){background:#211c22;color:#faf6f8}
html:root[data-theme="dark"] body .clofit-legal-page .legal-date{color:#c8bdc5}

html body :is(#reel-settings-title,#merchant-settings-title) .clofit-wordmark{width:160px!important;margin:8px 0!important}
html body :is(.reel-settings-head,#merchant-settings-sheet>header){margin-bottom:28px!important}

html body .buyer-settings-heading .clofit-wordmark{width:160px!important;margin:8px 0!important}
html body .buyer-settings-heading{margin-bottom:28px!important}
/* Identical logo geometry in all shopping and management settings headers. */
html:root body.ui-consistent :is(.buyer-settings-heading,.reel-settings-head,.merchant-settings-card>header){display:flex!important;direction:ltr!important;justify-content:space-between!important;align-items:flex-start!important}
html:root body.ui-consistent :is(.buyer-settings-heading,.reel-settings-head,.merchant-settings-card>header)>:is(h1,h2,h3,.clofit-wordmark){order:0!important;margin-left:0!important;margin-right:auto!important}
html:root body.ui-consistent :is(.buyer-settings-heading,.reel-settings-head,.merchant-settings-card>header)>button{order:1!important;margin-left:auto!important;margin-right:0!important}
html:root body.ui-consistent :is(.buyer-settings-heading,.reel-settings-head,.merchant-settings-card>header) .clofit-wordmark{width:160px!important;max-width:100%!important;flex:0 0 160px!important;margin:8px 0!important;align-self:flex-start!important}
html:root body.ui-consistent :is(#merchant-settings-title,#reel-settings-title){margin:0!important;padding:0!important;text-align:left!important;line-height:1!important}

html:root body .clofit-welcome-heading>.clofit-wordmark{width:160px!important;margin:0 auto!important}

/* Blend at the outer frame: its overflow isolation otherwise leaves the black bitmap box visible. */
html:root[data-theme="dark"] body .clofit-wordmark{mix-blend-mode:screen!important}
/* Luminance mask removes black pixels rather than compositing an opaque bitmap. */
html:root[data-theme="dark"] body .clofit-wordmark{mix-blend-mode:normal!important}
html:root[data-theme="dark"] body .clofit-wordmark>img{opacity:0!important}
html:root[data-theme="dark"] body .clofit-wordmark::after{content:"";position:absolute;width:111.21%;height:206.67%;left:-5.9%;top:-49%;background:#fff;-webkit-mask-image:url('../images/clofit-color-logo-preview.png');mask-image:url('../images/clofit-color-logo-preview.png');mask-mode:luminance;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}

/* Approved CLOFIT color wordmark. */
html:root body .mobile-about-color-logo {display:block!important;position:relative!important;width:140px!important;aspect-ratio:2172 / 430!important;overflow:hidden!important;margin:12px auto 20px!important;}
html:root body .mobile-about-color-logo>img {display:block!important;position:absolute!important;width:100%!important;height:auto!important;max-width:none!important;inset:auto!important;left:0!important;top:-25.58%!important;opacity:1!important;}
html:root body .mobile-about-color-logo>.mobile-logo-gradient {display:none!important;}
html:root[data-theme="dark"] body .mobile-about-color-logo>img {filter:brightness(0) invert(1)!important;}
html:root[data-theme="dark"] body .mobile-about-color-logo>.mobile-logo-gradient {display:block!important;filter:none!important;clip-path:inset(0 40% 0 32%)!important;}

/* Shared in-app wordmark: approved color version on existing brand placements. */
html:root body :is(.clofit-wordmark,#reel-settings-sheet .clofit-wordmark,#merchant-settings-sheet .clofit-wordmark,#account-type-picker .clofit-wordmark) {aspect-ratio:2172 / 430!important;mix-blend-mode:normal!important;}
html:root body :is(.clofit-wordmark,#reel-settings-sheet .clofit-wordmark,#merchant-settings-sheet .clofit-wordmark,#account-type-picker .clofit-wordmark)>img {content:url('../images/clofit-color-logo-preview.png')!important;width:100%!important;height:auto!important;max-width:none!important;left:0!important;top:-25.58%!important;opacity:1!important;filter:none!important;mix-blend-mode:normal!important;}
html:root body :is(.clofit-wordmark,#reel-settings-sheet .clofit-wordmark,#merchant-settings-sheet .clofit-wordmark,#account-type-picker .clofit-wordmark)::after {display:none!important;}
html:root[data-theme="dark"] body :is(.clofit-wordmark,#reel-settings-sheet .clofit-wordmark,#merchant-settings-sheet .clofit-wordmark,#account-type-picker .clofit-wordmark)>img {filter:brightness(0) invert(1)!important;}
html:root[data-theme="dark"] body :is(.clofit-wordmark,#reel-settings-sheet .clofit-wordmark,#merchant-settings-sheet .clofit-wordmark,#account-type-picker .clofit-wordmark)::after {content:""!important;display:block!important;position:absolute!important;left:0!important;top:-25.58%!important;width:100%!important;height:168.37%!important;background:transparent url('../images/clofit-color-logo-preview.png') no-repeat 0 0 / 100% 100%!important;mask:none!important;-webkit-mask:none!important;clip-path:inset(0 40% 0 32%)!important;}
html:root[data-theme="dark"] body .clofit-welcome :is(.clofit-wordmark,#reel-settings-sheet .clofit-wordmark,#merchant-settings-sheet .clofit-wordmark,#account-type-picker .clofit-wordmark)>img {filter:none!important;}
html:root[data-theme="dark"] body .clofit-welcome :is(.clofit-wordmark,#reel-settings-sheet .clofit-wordmark,#merchant-settings-sheet .clofit-wordmark,#account-type-picker .clofit-wordmark)::after {display:none!important;}
