/* Shared responsive safety layer for active Star Promotion subpages. */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

:where(main, section, header, footer, nav, .container, .wrapper, .grid, .flex) {
    min-width: 0;
}

:where(.grid, .flex, .container, .wrapper) > * {
    min-width: 0;
    max-width: 100%;
}

:where(img, video, iframe, canvas, svg, audio) {
    max-width: 100%;
}

:where(input, select, textarea, button) {
    max-width: 100%;
}

:where(h1, h2, h3, h4, p, li, a, button, label, figcaption) {
    overflow-wrap: anywhere;
    word-break: normal;
}

@media (max-width: 768px) {
    :where(table) {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    :where(.fixed, [class*="fixed"]) {
        max-width: 100vw;
    }
}

@media (max-width: 380px) {
    :where(h1) { hyphens: auto; }
    :where(.container, .wrapper) { max-width: calc(100vw - 24px); }
}