@font-face {
    font-family: 'roboto';
    src: url('/fonts/roboto.woff2') format('woff2');
}

:root {
    color-scheme: light only;
}

* {
    scrollbar-color: #bdbdbd #f7f7f7;
    scrollbar-width: thin;
}

*::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

*::-webkit-scrollbar-track {
    background: #f7f7f7;
}

*::-webkit-scrollbar-thumb {
    background: #bdbdbd;
    border-radius: 6px;
    border: 3px solid #f7f7f7;
}

*::-webkit-scrollbar-thumb:hover {
    background: #9d9d9d;
}

* {
    margin: 0;
    margin-block: 0;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding: 0;
    padding-block: 0;
    padding-block-start: 0;
    padding-block-end: 0;
    padding-inline: 0;
    padding-inline-start: 0;
    padding-inline-end: 0;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    vertical-align: top;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

html,
body {
    height: 100vh;
    width: 100vw;
    background: hsl(240, 6%, 94.5%);
    font-family: 'roboto';
}

button,
input {
    -webkit-appearance: none;
    appearance: none;
    text-decoration: none;
    outline: none;
    border: none;
    background-color: transparent;
}

input:autofill,
input:autofill:hover,
input:autofill:focus,
input:autofill:active {
    -webkit-appearance: none;
    appearance: none;
    -webkit-text-fill-color: #000000;
    background-clip: text;
    -webkit-background-clip: text;
    background-color: transparent;
}

input:autofill,
input:autofill:hover,
input:autofill:focus,
input:autofill:active,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
input:-internal-autofill-selected,
input:-internal-autofill-selected:hover,
input:-internal-autofill-selected:focus,
input:-internal-autofill-selected:active {
    -webkit-appearance: none;
    appearance: none;
    -webkit-text-fill-color: #000000;
    background-clip: text;
    -webkit-background-clip: text;
    background-color: transparent;
}

button {
    cursor: pointer;
}

input {
    cursor: text;
}