Is it possible to detect css pseudo element using PHP?

In my responsive WordPress theme using Twitter Bootstrap, I’m trying to use a technique similar to CSS Conditional loading but relying on PHP instead of Javascript minimize from so many requests loading.

What I’d like to do is use PHP to detect the :after pseudo element content property to see which element is loading based upon the media query/viewport size of the browser.

Here’s example CSS:

    body:after { 
        display: none; 

        /* Default */
        content: "A";
    }

    @media (min-width: 35em) {
        body:after {
            content: "B";
        }
    }

To be very specific, if PHP can detect that content: "A" is active, it will load custom_mobile_content() hook which renders mobile content. If it detects content: "B", it will load custom_desktop_content() hook which renders more desktop content.

I tried using the javascript version but it requires I put a large block of formatted HTML into a javascript variable and upon rendering of the page there’s a huge block of text that’s inactive and unused on the page contained within the javascript. PHP seems to be a better fit.

Is there code which can produce this easily?

EDIT: It appears that I’d have to pass a JS variable or function to PHP in order for this to work, and I suppose that’s pretty complicated.

Here’s the javascript I’m trying to work with:

$(function() {
    var currentSize = "A";
    $(window).resize(function() {
        var size = window.getComputedStyle(document.body, ':after').getPropertyValue('content');

        /* Ridiculous thing to deal with inconsistent returning of
        value from query. Some browsers have quotes some don't */
        size = size.replace(/"/g, "");
        size = size.replace(/'/g, "");

        if (size != currentSize) {
            if (size == 'B') {
               $(".content").load('<?php custom_hook(); ?>');
               currentSize = 'B';
            }
        }

    }).resize();

}

I’ve included the above code in the WordPress page itself because it doesn’t need to be cached in a file. It is only used once and on this page. However, the problem with this is that the custom_hook() code is rendered on the page and that hook includes a bunch of markup. If the javascript determines that I’m using A, all that markup is on the page in the source code for no reason. I want to find a way to prevent the custom hook from rendering UNLESS it’s being used in B. Hope that makes sense.