Is there a way in CSS, JS, or JQuery to change all font sizes of an element by a specific factor (e.g. 1/2 of what the CSS says)?

I'm working on a report where the worker goes through it on the PHP website and then prints it out once completed. That is all fairly simple; however, when it prints, I'm going to want the size to be smaller than on the 46" widescreen the worker uses so that the tables fit on each page cleanly...

My normal CSS looks like this:

div#reportPage {
    display: flex;
    flex-direction: column;
    align-items: center;
}

table#report {
    border-collapse: collapse;
    margin-bottom: 25px;
}

table#report>thead>tr>th,
table#report>tbody>tr>td {
    border: 1px solid white;
    padding: 5px;
}

table#report>thead>tr>th.pt {
    font-size: 1.25em;
}

th.dn::after {
    white-space: pre;
    content: "\A Alt Name";
    font-size: 0.8em;
    font-style: italic;
}

th.prov>p {
    font-size: 0.8em;
    font-style: italic;
    margin: 0px;
    padding: 2px;
}

PHP/HTML

function weeklyTable($patient)
{
    include "system/connect.php";
    try {
        $regData = $conn->query("SELECT * FROM `medications` WHERE `status` = 1 AND `patient` = '$patient' AND `type` = 1 ORDER BY `name` ASC")->fetchAll();
        echo "<table id='report'>";
        echo "<thead><tr><th colspan=99 class='pt'>$patient - Standard Meds</th></tr>
                     <tr><th class='dn'>Drug Name</th><th>Rx #</th><th class='prov'>Provider<p>Department</p></th><th>Dose/Pill</th>
                     <th>Q/F</th><th>TOD</th><th>Su</th><th>M</th><th>Tu</th><th>W</th><th>Th</th><th>F</th><th>Sa</th></tr></thead>";
        foreach ($regData as $rx) {
            if ($rx['type'] == 1) {
            }
        }
        echo "</table>";

        $regData = $conn->query("SELECT * FROM `medications` WHERE `status` = 1 AND `patient` = '$patient' AND `type` = 2 ORDER BY `name` ASC")->fetchAll();
        echo "<table id='report'>";
        echo "<thead><tr><th colspan=99 class='pt'>$patient - Advanced Meds</th></tr>
                     <tr><th class='dn'>Drug Name</th><th>Rx #</th><th class='prov'>Provider<p>Department</p></th><th>Dose/Pill</th>
                     <th>Q/F</th><th>TOD</th><th>Su</th><th>M</th><th>Tu</th><th>W</th><th>Th</th><th>F</th><th>Sa</th></tr></thead>";
        foreach ($regData as $rx) {
            if ($rx['type'] == 1) {
            }
        }
        echo "</table>";

        $regData = $conn->query("SELECT * FROM `medications` WHERE `status` = 1 AND `patient` = '$patient' AND `type` = 3 ORDER BY `name` ASC")->fetchAll();
        echo "<table id='report'>";
        echo "<thead><tr><th colspan=99 class='pt'>$patient - OTC Meds</th></tr>
                     <tr><th class='dn'>Drug Name</th><th>Rx #</th><th class='prov'>Provider<p>Department</p></th><th>Dose/Pill</th>
                     <th>Q/F</th><th>TOD</th><th>Su</th><th>M</th><th>Tu</th><th>W</th><th>Th</th><th>F</th><th>Sa</th></tr></thead>";
        foreach ($regData as $rx) {
            if ($rx['type'] == 1) {
            }
        }
        echo "</table>";
        echo "<br/><br/>";
    } catch (PDOException $e) {
        echo "PDOError: {$e->getMessage()}";
        die();
    } catch (Exception $e) {
        echo "ExceptionError: {$e->getMessage()}";
    }
}

I'm still working on the tables and such, so please don't worry if you see something stupid in there, I literally copied and pasted the first one multiple times.

So my 'normal' font-size is 1em (with a few exceptions)... If I want it to print at a 0.75 modifier (75% of the original font-size) on ALL items, including those that are at 1.25em and 0.8em - is there a clean way to do that besides re-coding the css (I'm already going to be doing @media print, so please don't think I've forgotten that)?

Also - no need to worry about injection - this is all input on our side, and validated/prepared there.