*,
::before,
::after {
    box-sizing: border-box;
}

* {
    scrollbar-width: thin;
}

:where(html) {
    block-size: 100%;
    font-family: system-ui;
    interpolate-size: allow-keywords;
    -moz-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;

    scroll-behavior: smooth;
}

:where(body) {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    container-type: inline-size;
    font-synthesis: style;
    inline-size: 100%;
    margin: 0;
    min-block-size: 100%;
    min-inline-size: 320px;
    position: relative;
    text-rendering: optimizeLegibility;
}

:where(:not(dialog, popover)) {
    margin: 0;
}

:where(html) {
    color-scheme: light dark;
}