* { box-sizing: border-box; }
html, body {top: 0; margin: 0; background: #FFFFCC; color: black; font: var(--body-size, 20px) var(--font-family, "Times New Roman"), serif; }
main { position: relative; width: 100%; --columns: 5; --paper-height: 424.285714px; }
#text-flow { position: relative; background: var(--background, #f7f7f7); }
#text-flow > section { width: var(--content-width, 60%); margin: 32px auto; }
.masthead { width: var(--content-width, 60%); margin: 0 auto 40px; display: grid; grid-template-columns: 1fr 1fr; align-items: start; }
section { min-width: 0; scroll-margin-top: 24px; }
#profile { position: relative; width: var(--content-width, 60%); margin: 0 auto 24px; top: 24px; }
#profile > .section-content { padding-top: 0; }
#profile h1 { margin-top: 0; }
#contents ul { margin-top: 8px; }
.year { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.section-content { padding: 8px; }
h1 { font-size: var(--name-size, 32px); }
h2 { font-size: var(--heading-size, 30px); }
h3 { font-size: 24px; }
p, li, td { overflow-wrap: anywhere; }
a:link { color: #0000ee; }
a:visited { color: #551a8b; }
a:active { color: #ff0000; }
table { width: 100%; max-width: 100%; margin-left: auto; margin-right: auto; font-size: inherit; border-collapse: collapse; border-spacing: 0; border: 0.5px solid black; }
th { text-align: left; }
th, td { vertical-align: top; padding: 10px 12px; border: 0.5px solid black; }
ul { padding-left: 20px; }
figure { margin: 0; }
figure img { display: block; width: 100%; height: auto; }
.photo-placeholder { min-height: 250px; }
#paper-layer { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(var(--columns), minmax(0, 1fr)); grid-auto-rows: var(--paper-height); pointer-events: none; }
#paper-layer > article { background: transparent; }
canvas#wind { z-index: 1; position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; }
html.has-wind #text-flow { opacity: 0; }
html.has-wind.reading #text-flow { opacity: 1; }
html.reading #wind { visibility: hidden; }
@media (max-width: 900px) {
 #text-flow > section, .masthead { width: var(--content-width, 60%); margin-left: auto; margin-right: auto; }
 .masthead { grid-template-columns: 1fr; }
 #profile { width: var(--content-width, 60%); }
 #contents h2 { font-size: var(--heading-size, 30px); }
}
@media print {
 @page { size: A4; margin: 12mm; }
 #paper-layer, #wind { display: none; }
 #profile { position: static; width: 100%; max-height: none; }
 #text-flow > section, .masthead { width: 100%; margin: 0 0 24px; }
 #text-flow { display: block; opacity: 1 !important; }
 section { break-inside: avoid; }
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

a { white-space: normal; overflow-wrap: anywhere; word-break: normal; }

[data-kind="projects"] th, [data-kind="projects"] td { min-width: 120px; }
[data-kind="projects"] th:first-child, [data-kind="projects"] td:first-child { min-width: 90px; }
[data-kind="projects"] th:nth-child(2), [data-kind="projects"] td:nth-child(2) { min-width: 180px; }
[data-kind="projects"] th:last-child, [data-kind="projects"] td:last-child { min-width: 180px; }

@media screen and (max-width: 600px) {
 html, body { font-size: 12px; }
 h1 { font-size: 19.2px; }
 h2, #contents h2 { font-size: 18px; }
 h3 { font-size: 14.4px; }
 #text-flow > section, .masthead, #profile { width: 100%; margin-left: 0; margin-right: 0; }
 .masthead { grid-template-columns: 1fr; }
 .section-content { padding: 1vw; }
 table { table-layout: fixed; }
 th, td { padding: 1vw; min-width: 0 !important; }
 .year { white-space: normal; overflow-wrap: anywhere; }
}

td > p:first-child { margin-top: 0; }
td > p:last-child { margin-bottom: 0; }