/* Phase 1 (Mobile UI Overhaul): base safeguards
   Keep this file minimal and low-risk. */

/* Prevent accidental full-page horizontal scrolling from overly-wide children.
   Horizontal scrolling should be handled by specific containers (e.g. tables). */
html,
body {
    max-width: 100%;
    /* clip, NOT hidden (R0-08): overflow-x:hidden makes the root a scroll
       container, which silently kills EVERY position:sticky in the app
       (app header, comparison/splits header rows). clip keeps the
       h-overflow guard without creating a scroll container. */
    overflow-x: clip;
}

/* Media elements should never exceed their container width. */
img,
svg,
video,
canvas {
    max-width: 100%;
    height: auto;
}

/* Player Trends: cap chart height on small screens */
@media (max-width: 767.98px) {
    #pt-chart {
        height: 60vh !important;
        min-height: 320px;
    }
}

/* Predictable sizing reduces overflow surprises (esp. with padding + width%). */
*,
*::before,
*::after {
    box-sizing: border-box;
}