/* YOKO v2.11: independent logo tints, non-destructive, transparent images only */
.brand-canvas .yoko-logo-tint{width:100%;height:100%;display:block;flex:none;background-color:var(--logo-color,#fff);-webkit-mask-image:var(--logo-image);mask-image:var(--logo-image);-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:var(--logo-x,50%) var(--logo-y,50%);mask-position:var(--logo-x,50%) var(--logo-y,50%);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;transform:scale(var(--logo-zoom,1));}
.site-header.home-overlay.scrolled .yoko-header-logo-tint{background-color:var(--logo-scrolled-color,#202124)}
.site-header:not(.home-overlay) .yoko-header-logo-tint{background-color:var(--logo-scrolled-color,#202124)}
.site-footer .yoko-footer-logo-tint{display:block;width:145px;height:75px;margin-bottom:16px;background-color:var(--logo-color,#d7b57b);-webkit-mask:var(--logo-image) center / contain no-repeat;mask:var(--logo-image) center / contain no-repeat;}
.yoko-logo-controls .form-two{align-items:end}.yoko-logo-controls select{width:100%;min-height:43px;border:1px solid #ced8d0;background:white;padding:10px}.yoko-logo-controls input[type=color]{min-height:43px;cursor:pointer}
.yoko-logo-live-preview{display:flex;gap:16px;flex-wrap:wrap;margin-top:18px}.yoko-logo-preview-dark,.yoko-logo-preview-light{flex:1;min-width:180px;padding:16px 18px;background:#171717;color:#fff;border-radius:6px}.yoko-logo-preview-light{background:#fff;color:#222;border:1px solid #ddd}.yoko-logo-live-preview strong{font-size:11px;display:block;margin-bottom:12px}.yoko-logo-preview-image{display:block;width:180px;max-width:100%;height:75px;background-position:center;background-repeat:no-repeat;background-size:contain}

/* v2.12: recolored silhouette receives a generated alpha mask, preserving dimensions */
.yoko-logo-tint { transition: background-color .2s ease; }
.yoko-footer-logo-tint { flex-shrink:0; }