html {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
        Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
        sans-serif;
    line-height: 1.4;
    font-size: 18px;
}

body {
    background-color: rgb(238, 228, 237);

    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
    padding: 0;
    /* min-height: 100vh; */
}

h1 {
    margin: 0 0 1rem;
}

.name {
    width: 40vw;
    min-width: min(350px, 95vw);
    /* height: 25vh; */
    margin: 0.5rem auto;
    padding: 0;
    font-size: 1rem;
}

.name__highlights {
    animation: 3s infinite alternate highlight_pulse;
    animation-timing-function: ease-in-out;
}

.name__shadows {
    animation: 3s infinite alternate shadow_pulse;
    animation-timing-function: ease-in-out;
}

@keyframes highlight_pulse {
    from {
        fill: #f1a5e3;
    }

    to {
        fill: #ffc5f4;
    }
}

@keyframes shadow_pulse {
    from {
        fill: #a261cf;
    }

    to {
        fill: #d293ff;
    }
}

a,
a:visited {
    color: #6d2b9c;
}
a:focus,
a:active {
    background-color: #ffc5f4;
    color: #4b1373;
    outline: none;
    box-shadow: 0 -2px 0 2px #ffc5f4, 0 2px 0 2px #4b1373;
    text-decoration: none;
}

main {
    /* background-color: #faeff8; */
    background-color: #f5f4f3;
    padding: 1rem;
    margin: 0 0.5rem 1rem;
    max-width: 40rem;
    border-radius: 0.25rem;
}

h2 {
    margin: 1.5rem 0 1rem;
}

h3 {
    margin: 1.5rem 0 0.5rem;
}

cite {
    font-style: italic;
}

.post__time {
    /* font-style: italic; */
    display: block;
    margin-bottom: 1rem;
}

.post__title {
    margin-bottom: 0.5rem;
}