*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{

    font-size:16px;

}

body{

    font-family:var(--font-family);

    background:var(--background);

    color:var(--text);

}

/*
Restore the browser's centered modal positioning after the universal reset.
Without this, native dialogs inherit margin: 0 and appear at the middle-left.
*/
dialog {

    margin:auto;

}

/*
The hidden attribute must always win.

A component that sets its own display, such as display:grid, otherwise
overrides the browser's built-in [hidden] rule, and JavaScript that sets
element.hidden = true silently stops working.
*/
[hidden] {

    display:none !important;

}