/* ============================================================
   TitleTown · Slip Analyzer · mobile idle page · v0.18.9
   ------------------------------------------------------------
   Loaded after mobile-v0.18.8. Measured 2026-09-22 at 393px in
   headless Chromium with three saved slips:
   (1) sa.css stacks Recent Slips over Weekly Record at <=720px,
       and the flow shell's `body.sa-flow-shell
       .sa-history-idle-grid { 1.08fr .92fr }` (0,2,1) beats it —
       the same specificity loss as v0.18.8's ALL column. The two
       panels sat side by side at 187px and 160px.
   (2) v0.16.83 truncates slip labels with overflow:hidden on an
       INLINE span, which does nothing, so each label ran across
       the Weekly Record panel under its pill and timestamp.
   (3) Before any slip, the hero's four KPI cells all read "—"
       and push the upload controls a screen down.
   ============================================================ */

@media (max-width: 720px) {
    body.sa-flow-shell .sa-history-idle-grid { grid-template-columns: minmax(0, 1fr); }
    body.sa-flow-shell .sa-recent-slip-label-text { display: block; }
}

@media (max-width: 600px) {
    /* idle hero: no slip yet, so no KPI cells */
    body.sa-flow-shell:has(#results[hidden]) #sa-command-hero .bh-side { display: none; }

    /* Recent Slips: header wraps; each row is label, then verdict + age */
    body.sa-flow-shell .sa-recent-slips-header { flex-wrap: wrap; gap: 6px 12px; }
    body.sa-flow-shell .sa-recent-slip-row {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas: "meta meta" "pill ago";
        row-gap: 7px;
        padding: 11px 12px;
    }
    body.sa-flow-shell .sa-recent-slip-row .sa-recent-slip-meta { grid-area: meta; font-size: 12px; }
    body.sa-flow-shell .sa-recent-slip-row .sa-recent-slip-label-text { white-space: normal; }
    body.sa-flow-shell .sa-recent-slip-row .sa-bottom-line { grid-area: pill; justify-self: start; }
    body.sa-flow-shell .sa-recent-slip-row .sa-recent-slip-ago { grid-area: ago; justify-self: end; }
}