:root {
    color-scheme: light dark;
}
body {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: "Adwaita Sans", "Cantarell", "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: light-dark(#222, #ddd);
}
article img {
    max-width: 100%;
    height: auto;
}
.container {
    width: 1000px;
    max-width: 100%;
}
.header {
    display: flex;
    border-bottom: 0.1em dotted #cccccc88;
    margin-bottom: 1em;
    align-items: center;
}
.header img {
    width: 10ch;
    height: 10ch;
}
.header h1 {
    font-weight: normal;
}
.header a {
    text-decoration: none;
}
#t1 {
    flex-grow: 2;
}
#f0 {
    font-style: italic;
}
footer {
    text-align: center;
    color: light-dark(#555, #777);
    margin-top: 2em;
}
blockquote {
    margin-left: 0;
    margin-right: 0;
    border-left: 5px solid #622;
    padding-left: 1em;
}
pre {
    white-space: pre-wrap;
    border-radius: 10px;
    padding: 10px;
    background-color: #cccccc33;
}
code {
    font-size: 120%;
}
/* post list */
#p0 {
    padding: 0;
}
.m0, .m0 ul {
    padding: 0;  
}
#p0 li {
    list-style: none;
    margin: 1em 0;  
}
#p0 time {
    display: block;
    background-color: CanvasText;
    padding: 0.2em;
    border-radius: 0.1em 0.1em 0 0;
    border: 1px solid grey;
    border-top: 3px solid #aaa;
    color: Canvas;
    width: 2ch;
    text-align: center;
}
.m0 li ul li {
    display: flex;
    align-items: baseline;
    gap: 1em;
}

figure {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

th {
  border-bottom: 0.1em dotted #cccccc88;
}

th, td {
  padding: 0.5em;
  word-break: break-all;
}

article video {
  max-width: 100%;
  height: auto;
}