@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@200..900&display=swap');

:root {
--link: #f37021 
}

html {
writing-mode: vertical-rl;
}

body {
font-kerning: none;

header {
writing-mode: horizontal-tb;
  position: fixed;
  top: 0;
  width: 100%;
}

.site-title {
margin-left: 1em;
}

.main-nav {
margin: 0 1em;
}

footer {
 display: none;
}

::selection {
background-color: var(--link);
color: white;
}

p {
 line-height: 1.8;
 font-family: "Source serif TC", "Noto Serif TC", "宋體-繁", serif;
 font-optical-sizing: auto;
 font-weight: 500;
 text-indent: 2em;
 text-align: justify;
 margin: 0;
}

.post-date {
  font-family: "avenir", ui-sans-serif;
  text-indent: 0;
  text-align: right;
  margin-block: 1em 1em;
}

h2 {
margin-block: 1em 0;
margin-inline: 0 0;
}

h3 {
font-size: 1em;
margin: 0 2.2rem 0 0.4rem;
font-weigh:400;
}

.u-url {
font-size: 0.75em;
font-family: "Avenir", sans-serif;
}

.post-title {
margin-top: 0;
}

main {
max-height: 30em;
margin: 6em 0 0 0;
padding: 0;
}

article { 
padding: 0;
margin: 0;
text-autospace: normal;
text-trim-spacing: trim-start;
}

article:last-of-type {
margin-bottom: inherit;
}

.tcy {
text-combine-upright: all;
}

strong {
 font-weight: 700;
 font-family: sans-serif;
}

em {
 text-decoration-line: underline;
 text-decoration-thickness: 0.5px !important;
 font-style: normal;
}

blockquote {
border: none;
font-style: normal;
padding-inline: 2em 2em;
padding-block: 0 0;
margin-block: 1.8em 1.8em;
margin-inline: 0 0;
}

ul {
margin-inline: 2em 0;
margin-block: 1em 1em;
padding: 0;
}

ul li p {
  text-indent: 0;
  font-weight: 300;
}

blockquote p {
font-family: sans-serif;
font-weight: 300;
text-indent: 1em;
}

pre {
margin: 0 1em 0 1em;
}

pre:hover {
transform: rotate(-90deg);
transition-duration: 2s;
box-shadow:0 0 0 1600px rgba(0,0,0,0.65);
}

img {
max-inline-size: 28em;
block-size: auto;
}

.m2t2 {
text-indent: -2em;
margin-inline-start: 2em;
}

.sep {
margin-inline-start: 4em;
margin-block: 1.8em;
}