/* resets any previous style, e.g. from user or user agent style sheet
   beware: also resets styling properties of SVG elements defined as presentational attributes,
   because they behave as if they were defined at the top of the author style sheet
   with specificity 0, and therefore the `all` shorthand overrules them.
   Need to style SVG elements instead in CSS, e.g. using inline styles.
*/

*, *::before, *::after {
    all: unset;
}

/* hide head */

head, meta, title, link, style, script {
    display: none;
}

/* enable focus outline for accessibility */

:focus-visible {
    outline-color: var(--focus-outline-color, rgb(0, 119, 204));
    outline-width: var(--focus-outline-width, 1px);
    outline-style: auto;
    outline-offset: var(--focus-outline-offset, 0);
}

/* include border in box size
*/

/* make Flex Layout default layout
*/

/* invert border defaults
*/

*, *::before, *::after {
    box-sizing: border-box;
    display: flex;
    border-width: 0;
    border-style: solid;
}

/* make root element size of viewport

note: inline-size: 100% is already default in Flex Layout !
*/

html {
    block-size: 100%;
}

/* make entry point element full size

note: cross axis stretch by default in Flex Layout, where cross axis is block direction by default in Flex Layout

disable cross axis stretch on any child element, e.g. align-self: start;
*/

body {
    flex: 1;
}

div, p, h1, h2, h3, h4, h5, h6 {
    display: block;
}

b, em, a, span {
    display: inline-block;
}