@layer base {
    html {
        @apply overflow-x-hidden;

        scroll-behavior: smooth;
    }

    body {
        @apply bg-blue-400;
        @apply font-hairline;
        @apply font-mono;
        @apply text-blue-100;
        @apply text-md;
    }

    @media screen and (prefers-reduced-motion: reduce), (update: slow) {
        html {
            scroll-behavior: auto;
        }

        *,
        *::before,
        *::after {
            animation-duration: 0.001s !important;
            transition-delay: 0.001s !important;
            transition-duration: 0.001s !important;
        }
    }

    button,
    [role='button'],
    input[type='submit'] {
        background: none;
        color: inherit;
        cursor: pointer;
        font-family: inherit;
        font-size: inherit;
        font-weight: inherit;
        line-height: inherit;
        margin: 0;
        padding: 0;
        text-transform: inherit;

        &[disabled] {
            cursor: not-allowed;
        }
    }

    /* Eliminate outline for mouse users */
    html[data-whatintent='mouse'] *:focus,
    html[data-whatintent='touch'] *:focus {
        outline: none;
    }

    svg {
        fill: currentColor;
    }

    abbr[title] {
        text-decoration: none;
    }

    table {
        border-spacing: 0;
    }

    th {
        text-align: left;
    }
}