/* Own product identity; the native shell and third-party marks stay separate. */
:root{--product-mark:url('/xshop-lab/brand/source-bot.svg')}
.deck-brand{display:inline-flex;align-items:center;text-decoration:none;line-height:0;color:#f4f4f5;white-space:nowrap;min-width:0}
.deck-brand>img{width:198px;height:auto;object-fit:contain;flex:none;max-width:100%}
.foot-mark.deck-brand>img{height:auto;width:280px}
.lab-last-card>.deck-brand{align-self:flex-start;width:100%}
.lab-last-card>.deck-brand>img{width:100%;max-width:340px;height:auto}
.product-wordmark{display:block;width:min(1240px,92vw);height:auto;line-height:0;font-size:0;letter-spacing:normal}
.product-wordmark>img{display:block;width:100%;height:auto}
.hero .stage{margin-top:calc(min(1240px,92vw) / 7.911 * -.22)}
.glogo{-webkit-mask:var(--product-mark) center/contain no-repeat;mask:var(--product-mark) center/contain no-repeat}
.btn-x>.deck-button-mark{filter:brightness(0)}
.launch-ticker>.deck-ticker-mark{display:grid;place-items:center;width:46px;height:46px;flex:none;padding:9px;border-radius:13px;background:#e9e9ed}
.deck-ticker-mark>img{display:block;width:100%;height:100%;object-fit:contain;filter:brightness(0)}
#draft-art.project-fallback{filter:brightness(0);border-radius:0}
.phone .ph-top>.deck-avatar{background:#111;border:1px solid #ffffff28;padding:6px;filter:none}
.phone .dm-gc i{-webkit-mask:var(--product-mark) center/contain no-repeat;mask:var(--product-mark) center/contain no-repeat}
.phone .ph-in{width:calc(100% - 24px)}
#agents-window .rcpt-card>.agent-receipt-mark,.agent-receipt-mark{-webkit-mask:var(--product-mark) center/contain no-repeat;mask:var(--product-mark) center/contain no-repeat}
@media(max-width:560px){
 .nav .deck-brand>img{width:152px;height:auto}
 .product-wordmark{font-size:0}
 .launch-ticker>.deck-ticker-mark{width:38px;height:38px;padding:8px}
 .logo-grid>.logo-tile{min-height:124px;gap:8px;padding:12px 8px;aspect-ratio:auto;min-width:0;width:100%}
 .logo-grid>.logo-tile>img{height:38px;width:50%}
}
@media(max-width:380px){
 .nav .deck-brand>img{width:132px}
 .nav-right .btn-x{padding-inline:12px}
 .nav-right .btn-x>.deck-button-mark{display:none}
}

/* Theme-aware monochrome ecosystem marks, including both hover and keyboard focus. */
#brands-live{grid-template-columns:repeat(5,minmax(0,1fr))}
#brands-live .logo-tile{min-width:0;color:#f4f4f5;transition:background .3s,color .3s}
#brands-live .logo-tile>img{filter:brightness(0) invert(1)}
#brands-live .logo-tile>img.eco-tonal{filter:grayscale(1)}
#brands-live .eco-name{color:#b1b1b6}
#brands-live .logo-tile small{color:#8e8e95}
#brands-live .eco-pair{display:flex;align-items:center;justify-content:center;gap:12px;width:82%;height:66px;color:inherit}
#brands-live .eco-pair img{display:block;width:36%;max-width:64px;height:58px;object-fit:contain;filter:brightness(0) invert(1);transition:transform .5s var(--ease)}
#brands-live .eco-pair b{font:300 25px/1 var(--sans);color:inherit}
#brands-live .logo-tile:is(:hover,:focus-visible){background:#f4f4f5;color:#101011}
#brands-live .logo-tile:is(:hover,:focus-visible) .eco-name{color:#101011}
#brands-live .logo-tile:is(:hover,:focus-visible) small{color:#505057}
#brands-live .logo-tile:is(:hover,:focus-visible)>img:not(.eco-tonal),
#brands-live .logo-tile:is(:hover,:focus-visible) .eco-pair img{filter:brightness(0)}
#brands-live .logo-tile:focus-visible{outline:2px solid #777;outline-offset:-5px}
@media(max-width:860px){
 #brands-live{grid-template-columns:repeat(3,minmax(0,1fr))}
 #brands-live .logo-tile-connect{grid-column:span 2;aspect-ratio:auto}
}
@media(max-width:560px){
 #brands-live{grid-template-columns:repeat(2,minmax(0,1fr))}
 #brands-live .logo-tile>img{height:44px}
 #brands-live .eco-pair{height:44px;gap:18px}
 #brands-live .eco-pair img{width:44px;height:44px}
 #brands-live .eco-name{font-size:13px}
}