:root {
  --ui: "Avenir Next", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --book: "Iowan Old Style", Palatino, Georgia, serif;
  color-scheme: dark;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; background: #c4a47e; font: 18px/1.5 var(--ui); }
a { color: inherit; }
@view-transition { navigation: auto; }
::view-transition-group(*) { animation-duration: .5s; animation-timing-function: cubic-bezier(.2, .8, .2, 1); }
/* The photographed bookshelf belongs to this website, not the book-making Skill. */
#shelf { position: relative; width: 100%; min-height: 100dvh; margin: 0; color: #443526; }
.shelf-top { position: absolute; z-index: 2; inset: 0 0 auto; display: flex; justify-content: space-between; align-items: center; height: 3%; padding: 0 2.6%; }
#shelf-title { margin: 0; font: 600 clamp(14px, 1.35vw, 25px)/1 var(--ui); letter-spacing: -.4px; view-transition-name: none; }
.shelf-brand { text-decoration: none; }
.shelf-brand { display: inline-flex; align-items: center; gap: 6px; color: #352b20; text-shadow: 0 1px #ecd3a54a; }
.shelf-brand > span { font: clamp(21px, 2vw, 36px)/.7 var(--book); color: #3c3021; }
.shelf-top p { margin: 0; color: #493b2d; font: 500 clamp(10px, .9vw, 15px) var(--ui); text-shadow: 0 1px #ecd3a54a; }
.photo-shelf { position: relative; width: 100%; aspect-ratio: 3 / 4; container-type: inline-size; margin: 0; }
.shelf-photo { display: block; width: 100%; height: auto; }
.shelf-tier { display: contents; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.book-hotspot { position: absolute; display: block; top: 4.9%; height: 23.3%; text-decoration: none; border-radius: 2px; outline-offset: 4px; }
.algebra-book { left: 10.1%; width: 26.1%; }
.math-book { left: 39.9%; width: 24.5%; }
.book-hotspot:hover { box-shadow: 0 0 0 2px #f7d998b3, 0 0 28px #edc97833; }
#shelf a:focus-visible { outline: 3px solid #f4d786; outline-offset: 5px; }
.book-caption { position: absolute; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column; justify-content: center; gap: .35cqw; min-height: 6.45cqw; padding: 1.1cqw 1.2cqw .9cqw; color: #faf7e9; background: linear-gradient(110deg, #263d32f5, #182a23f0); box-shadow: 0 -2px 8px #0003; font: 1.4cqw/1.25 var(--ui); transition: background .2s; }
.math-book .book-caption { background: linear-gradient(110deg, #704732f7, #503721f0); }
.book-caption strong { font-weight: 600; padding-right: 1.5cqw; }
.book-caption strong > span { position: absolute; right: 1.2cqw; top: 1.1cqw; color: #e8c68b; }
.book-caption small { color: #e2dbca; font-size: 1.03cqw; letter-spacing: .03em; }
.resume-label { position: absolute; padding: .46cqw .74cqw; background: #fcf4df; color: #3c4336; box-shadow: 1px 2px 5px #0003; font: 1.03cqw var(--ui); transform: rotate(-3deg); }
.physics-pending { position: absolute; left: 71.4%; top: 25.6%; padding: .46cqw .92cqw; border: 1px solid #edcf73; background: #f1d174; color: #302b1f; font: 1.1cqw var(--ui); transform: rotate(-2deg); box-shadow: 1px 2px 4px #0003; }
.github-drawer { position: absolute; left: 9%; top: 87.5%; width: 68%; height: 8.5%; text-decoration: none; }
.shelf-noscript { position: absolute; bottom: 0; left: 24px; margin: 0; font: 11px var(--ui); color: #352c21; }
.shelf-footer { position: absolute; inset: auto 0 0; display: flex; justify-content: center; align-items: center; gap: 3%; height: 3%; padding: 0 3%; color: #594129; font: 500 clamp(10px, .85vw, 14px)/1.4 var(--ui); text-shadow: 0 1px #ffe6bd66; }
.shelf-footer button { padding: 2px 0; border: 0; border-bottom: 1px solid #59412966; background: transparent; color: inherit; font: inherit; cursor: pointer; text-shadow: inherit; }
.shelf-footer button:hover { color: #2d2116; border-bottom-color: currentColor; }
.shelf-footer button:focus-visible { outline: 2px solid #594129; outline-offset: 5px; }
.shelf-about { max-width: 580px; padding: 38px 42px; border: 1px solid #a08760; border-radius: 3px; background: #f6efdf; color: #403527; box-shadow: 0 20px 80px #291b1455; }
.shelf-about::backdrop { background: #20180fc4; backdrop-filter: blur(4px); }
.shelf-about h2 { margin: 12px 0 20px; font: 400 32px var(--book); }
.shelf-about p { font: 15px/1.7 var(--ui); }
.shelf-about .about-kicker { margin: 0; color: #826545; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.about-close { position: absolute; right: 16px; top: 12px; padding: 0 7px; background: transparent; border: 0; color: #675542; font: 26px var(--ui); cursor: pointer; }
@media (prefers-reduced-motion: reduce) {
  .book-caption { transition: none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}