fix(web): booth UI/UX pass — readable font scaling + booth layout/report clarity

A round of operator-facing fixes on the booth screen, shift views, and the
font-scale control. (Follows the font-scale feature in f706726, which used CSS
`zoom` — reverted here for the rem approach below.)

Font scaling (the A−/A+ control now actually works without breaking layout):
- The control scaled via CSS `zoom`, which also scaled viewport-locked containers
  (h-screen frame, max-h-[90vh] modals) so at 130% modal headers/footers were
  pushed off-screen. Reworked to scale TEXT only: converted every `text-[Npx]`
  font utility to rem across the web app (~230 sites in 25 files + the
  .label/.hint/.btn component classes + body in index.css; 16px root, so 100% is
  visually identical), and applyFontScale now sets the ROOT font-size. vh/h-screen
  layout stays put, so chrome never clips; tall content scrolls its own container.
  Verified at 130%: text 12px→15.6px while the frame stayed viewport-height.

Live feed (event rows):
- Plate, badges and reason now flow inline after the identity and wrap only when
  the row runs out of width — no more forced second line when there's empty space.
- Dropped the redundant TARGË via-badge (the plate chip already conveys it).
- Removed the Direction filter group (Hyrje/Dalje) — it duplicated the entry/exit
  options already in the Type filter.

Active sessions:
- Rebuilt as a real table (Ticket/subscriber · Plate · Entry · Elapsed) so columns
  align and long values (subscriber names, ticket ids) no longer truncate.
- Dropped the status column (an unpaid transient is normal; a subscriber shows ★ +
  name; overstay keeps a row tint). Removed the now-redundant status filter; only
  the Transient/Subscriber filter remains. Plate is now searchable (uses s.plate).

Shift report (close-shift modal + Shift History + printed Z-report slip):
- Removed the confusing `shitje` (subscription-sales) sub-line — Abonime is the
  total; only the out-of-window part is broken out. subscriptionSalesMinor stays in
  the signed payload (audit data), just not displayed/printed.
- Show the inherited opening cash ("Arka fillestare") above the expected drawer, so
  opening + cash-taken = expected reads clearly. Money values no longer line-wrap.

Subscription edit modal:
- Fixed the 2-col grid alignment: a lone "only one version" cell was shifting every
  following row by one column — it now emits a full label+value pair.

Removed orphaned i18n keys (fStatus*, fDir*, srcSubSales) from sq+en (parity kept).
Full workspace build/lint/test green.

Claude-Session: https://claude.ai/code/session_01Xcm6ikLgGoCxxHrxtjkk5V

apps/web/src/TariffComposer.tsx

@@ -354,11 +354,11 @@ export function TariffComposer() {
     <section className="px-4 py-6">
       <h2 className="mb-1 text-h4 font-semibold text-term-text">{t("tariff.title")}</h2>
       {!state?.active ? (
-        <p className="mb-4 rounded-term border border-term-amber/50 bg-term-amber/10 px-3 py-2 text-[12px] text-term-amber">
+        <p className="mb-4 rounded-term border border-term-amber/50 bg-term-amber/10 px-3 py-2 text-[0.75rem] text-term-amber">
           {t("tariff.noRateCard")}
         </p>
       ) : (
-        <p className="mb-4 text-[12px] text-term-muted">
+        <p className="mb-4 text-[0.75rem] text-term-muted">
           {t("tariff.activeSince", {
             date: new Date(state.active.effectiveFrom).toLocaleString(),
             count: state.versions.length,
@@ -407,7 +407,7 @@ export function TariffComposer() {
         {/* A stepped ("up-to") base rate cannot be combined with time tiers — the
             engine would ignore them. Warn up-front; publishing is also blocked server-side. */}
         {form.base.mode === "stepped" && form.tiers.length > 0 && (
-          <p className="mb-3 rounded-term border border-term-red/50 bg-term-red/10 px-3 py-2 text-[12px] text-term-red">
+          <p className="mb-3 rounded-term border border-term-red/50 bg-term-red/10 px-3 py-2 text-[0.75rem] text-term-red">
             {t("tariff.steppedTiersConflict")}
           </p>
         )}
@@ -432,7 +432,7 @@ export function TariffComposer() {
               <label className="label">{t("tariff.tierDays")}</label>
               <span className="flex flex-wrap gap-2">
                 {[1, 2, 3, 4, 5, 6, 0].map((d) => (
-                  <label key={d} className="inline-flex items-center gap-1 text-[12px] text-term-text">
+                  <label key={d} className="inline-flex items-center gap-1 text-[0.75rem] text-term-text">
                     <input type="checkbox" className="accent-term-amber" checked={tr.dow.includes(d)} onChange={() => toggleDow(i, d)} />
                     {t(`tariff.dow${d}`)}
                   </label>
@@ -444,7 +444,7 @@ export function TariffComposer() {
                 <span className="text-term-muted">–</span>
                 <input className="input w-20" value={tr.toHour} onChange={(e) => setTier(i, { toHour: e.target.value })} placeholder="06:00" />
                 {tr.fromHour && tr.toHour && tr.toHour <= tr.fromHour && (
-                  <span className="text-[11px] text-term-muted">{t("tariff.tierOvernight")}</span>
+                  <span className="text-[0.6875rem] text-term-muted">{t("tariff.tierOvernight")}</span>
                 )}
               </span>
               <label className="label">{t("tariff.tierDates")}</label>
@@ -478,7 +478,7 @@ export function TariffComposer() {
           {saving ? t("tariff.publishing") : t("tariff.publishNewVersion")}
         </button>
         {msg && (
-          <span className={msg.kind === "ok" ? "text-[12px] text-term-green" : "text-[12px] text-term-red"}>{msg.text}</span>
+          <span className={msg.kind === "ok" ? "text-[0.75rem] text-term-green" : "text-[0.75rem] text-term-red"}>{msg.text}</span>
         )}
       </div>
     </section>
@@ -504,7 +504,7 @@ function PricingEditor(props: {
   const { t, pricing: p } = props;
   return (
     <div>
-      <div className="mb-3 flex gap-4 text-[12px]">
+      <div className="mb-3 flex gap-4 text-[0.75rem]">
         <label className="inline-flex items-center gap-1.5 text-term-text">
           <input type="radio" className="accent-term-amber" checked={p.mode === "ladder"} onChange={() => props.onMode("ladder")} />
           {t("tariff.modeLadder")}
@@ -538,7 +538,7 @@ function PricingEditor(props: {
                   <td className="px-2 py-1">
                     <span className="inline-flex items-center gap-2">
                       <input className="input w-20" value={s.hours} onChange={(e) => props.onStep?.(i, { hours: e.target.value })} placeholder={t("tariff.egHours")} />
-                      <span className="text-[11px] text-term-muted">{t("tariff.hoursUnit")}</span>
+                      <span className="text-[0.6875rem] text-term-muted">{t("tariff.hoursUnit")}</span>
                     </span>
                   </td>
                   <td className="px-2 py-1">
@@ -587,7 +587,7 @@ function PricingEditor(props: {
                       ) : (
                         <span className="inline-flex items-center gap-2">
                           <input className="input w-20" value={b.hours} onChange={(e) => props.onBlock(i, { hours: e.target.value })} placeholder={t("tariff.egHours")} />
-                          <span className="text-[11px] text-term-muted">{t("tariff.hoursUnit")}</span>
+                          <span className="text-[0.6875rem] text-term-muted">{t("tariff.hoursUnit")}</span>
                         </span>
                       )}
                     </td>