@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap');

:root {
    --background-main: #FFFFFF;
    --background-body: #F0F0F0;
    --text-color-section: #000000;
    --text-color-sidebar: #FFFFFF;
    --accent-color: #185057;
}

body {
    max-width: 960px;
    margin: 0 auto;
    color: var(--text-color-section);
    background: var(--background-body);
    font-family: "Source Sans Pro", sans-serif;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.inner {
    display: flex;
    background: var(--background-main);
}

aside {
    flex: 35%;
    background: var(--accent-color);
}

main, .sidebar {
    padding: 0 24px 24px;
}

main {
    flex: 65%;
}

.sidebar {
    color: var(--text-color-sidebar);
}

img {
    width: 100%;
}

a {
    color: inherit;
}

.row {
    display: flex;
    gap: 24px;
}

.column-left {
    flex: 96px;
}

.column-right {
    flex: calc(100% - 96px);
}

.date {
    text-align: right;
}

@media (prefers-color-scheme: dark) {
    :root {
        --background-body: #000000;
        --background-main: #1C1B22;
        --text-color-section: #FFFFFF;
    }
}

@media (max-width: 620px) {
    .inner {
        display: block;
    }
}

@media print {
    .inner {
        height: 300vh;
    }

    .activity {
        break-inside: avoid;
        margin-top: -1px;
        border-top: 1px solid transparent;
    }
}
