/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/fonts/ibm-plex-mono-300-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/fonts/ibm-plex-mono-300-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/ibm-plex-mono-400-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/ibm-plex-mono-400-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/ibm-plex-mono-500-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/ibm-plex-mono-500-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 300 500;
  font-display: swap;
  src: url("assets/fonts/newsreader-italic-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 300 500;
  font-display: swap;
  src: url("assets/fonts/newsreader-italic-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url("assets/fonts/newsreader-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url("assets/fonts/newsreader-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/noto-serif-sc-cjk-subset-2.woff2") format('woff2');
  unicode-range: U+23, U+3d, U+4e01, U+4e39, U+4e73, U+4ecd, U+4ed9, U+4eea, U+4f0a, U+4f1f, U+4f5b, U+4fa0, U+4fc3, U+501f, U+50a8, U+515a, U+5175, U+51a0, U+51c0, U+51e1, U+51e4, U+5200, U+520a, U+5224, U+523a, U+52aa, U+52b1, U+52b3, U+5348, U+5353, U+5360, U+5371, U+5377, U+539a, U+541b, U+5434, U+547c, U+54e6, U+5510, U+5531, U+5609, U+56f0, U+56fa, U+5733, U+574f, U+5851, U+5854, U+5899, U+58c1, U+592e, U+5939, U+5976, U+5986, U+59bb, U+5a18, U+5a74, U+5b59, U+5b87, U+5b97, U+5ba0, U+5bab, U+5bbd-5bbe, U+5bf8, U+5c0a, U+5c3a, U+5c4a, U+5e16, U+5e1d, U+5e2d, U+5e8a, U+6015, U+602a, U+6050, U+6069, U+6162, U+61c2, U+6293, U+6297, U+62b1, U+62bd, U+62df, U+62fc, U+6302, U+635f, U+638c, U+63ed, U+6458, U+6469, U+6563, U+6620, U+6653, U+6696-6697, U+66dd, U+675f, U+676f-6770, U+67d0, U+67d3, U+684c, U+6865, U+6885, U+68b0, U+68ee, U+690d, U+6b23, U+6b32, U+6bd5, U+6c89, U+6d01, U+6d25, U+6d89, U+6da6, U+6db2, U+6df7, U+6ed1, U+6f02, U+70c8, U+70df, U+70e7, U+7126, U+7236, U+7259, U+731c, U+745e, U+74e3, U+751a, U+751c, U+7532, U+7545, U+75db, U+7761, U+7a0d, U+7b51, U+7ca4, U+7cd6, U+7d2b, U+7ea0, U+7eb9, U+7ed8, U+7f18, U+7f29, U+8033, U+804a, U+80a4-80a5, U+80e1, U+817f, U+829d, U+82e6, U+8336, U+840c, U+8499, U+864e, U+8651, U+865a, U+88ad, U+89e6, U+8bd7, U+8bfa, U+8c37, U+8d25, U+8d38, U+8ddd, U+8fea, U+9010, U+9012, U+906d, U+907f-9080, U+90d1, U+9177, U+91ca, U+94fa, U+9501, U+9634-9635, U+9694, U+9707, U+9738, U+9769, U+9a7b, U+9a97, U+9aa8, U+9b3c, U+9c81, U+9ed8;
}

@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/noto-serif-sc-cjk-subset-6.woff2") format('woff2');
  unicode-range: U+26, U+3c, U+d7, U+4e4e, U+4e61, U+4e71, U+4ebf, U+4f26, U+5012, U+51ac, U+51b0, U+51b2, U+51b7, U+5218, U+521a, U+5220, U+5237, U+523b, U+526f, U+5385, U+53bf, U+53e5, U+53eb, U+53f3, U+53f6, U+5409, U+5438, U+54c8, U+54e5, U+552f, U+5584, U+5706, U+5723, U+5750, U+575a, U+5987-5988, U+59b9, U+59d0, U+59d4, U+5b88, U+5b9c, U+5bdf, U+5bfb, U+5c01, U+5c04, U+5c3e, U+5c4b, U+5c4f, U+5c9b, U+5cf0, U+5ddd, U+5de6, U+5de8, U+5e01, U+5e78, U+5e7b, U+5e9c, U+5ead, U+5ef6, U+5f39, U+5fd8, U+6000, U+6025, U+604b, U+6076, U+613f, U+6258, U+6263, U+6267, U+6298, U+62a2, U+62e5, U+62ec, U+6311, U+6377, U+6388-6389, U+63a2, U+63d2, U+641e, U+642d, U+654f, U+6551, U+6597, U+65cf, U+65d7, U+65e7, U+6682, U+66f2, U+671d, U+672b, U+6740, U+6751, U+6768, U+6811, U+6863, U+6982, U+6bd2, U+6cf0, U+6d0b, U+6d17, U+6d59, U+6dd8, U+6dfb, U+6e7e, U+6f6e, U+6fb3, U+706f, U+719f, U+72af, U+72d0, U+72d7, U+732b, U+732e, U+7389, U+73e0, U+7530, U+7687, U+76d6, U+76db, U+7840, U+786c, U+79cb, U+79d2, U+7a0e, U+7a33, U+7a3f, U+7a97, U+7ade-7adf, U+7b26, U+7e41, U+7ec3, U+7f3a, U+8089, U+80dc, U+811a, U+8131, U+8138, U+821e, U+8349, U+83dc, U+8457, U+867d, U+86cb, U+8a89, U+8ba8, U+8bad, U+8bef, U+8bfe, U+8c6a, U+8d1d, U+8d4f, U+8d62, U+8dd1, U+8df3, U+8f6e, U+8ff9, U+900f, U+9014, U+9057, U+9192, U+91ce, U+9488, U+94a2, U+9547, U+955c, U+95f2, U+9644, U+964d, U+96c4-96c5, U+96e8, U+96f6-96f7, U+9732, U+9759, U+9760, U+987a, U+989c, U+9910, U+996d-996e, U+9b54, U+9e21, U+9ebb, U+9f50;
}

@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/noto-serif-sc-cjk-subset-0.woff2") format('woff2');
  unicode-range: U+25, U+4e14, U+4e1d, U+4e3d, U+4e49, U+4e60, U+4e9a, U+4eb2, U+4ec5, U+4efd, U+4f3c, U+4f4f, U+4f8b, U+4fbf, U+5019, U+5145, U+514b, U+516b, U+516d, U+5174, U+5178, U+517b, U+5199, U+519b, U+51b3, U+51b5, U+5207, U+5212, U+5219, U+521d, U+52bf, U+533b, U+5343, U+5347, U+534a, U+536b, U+5370, U+53e4, U+53f2, U+5403, U+542c, U+547d, U+54a8, U+54cd, U+54ea, U+552e, U+56f4, U+5747, U+575b, U+5883, U+589e, U+5931, U+5947, U+5956-5957, U+5a92, U+5b83, U+5ba4, U+5bb3, U+5bcc, U+5c14, U+5c1a, U+5c3d, U+5c40, U+5c45, U+5c5e, U+5df4, U+5e72, U+5e95, U+5f80, U+5f85, U+5fb7, U+5fd7, U+601d, U+626b, U+627f, U+62c9, U+62cd, U+6309, U+63a7, U+6545, U+65ad, U+65af, U+65c5, U+666e, U+667a, U+670b, U+671b, U+674e, U+677f, U+6781, U+6790, U+6797, U+6821, U+6838-6839, U+697c, U+6b27, U+6b62, U+6bb5, U+6c7d, U+6c99, U+6d4b, U+6d4e, U+6d6a, U+6e29, U+6e2f, U+6ee1, U+6f14, U+6f2b, U+72b6, U+72ec, U+7387, U+7533, U+753b, U+76ca, U+76d8, U+7701, U+773c, U+77ed, U+77f3, U+7814, U+793c, U+79bb, U+79c1, U+79d8, U+79ef, U+79fb, U+7a76, U+7b11, U+7b54, U+7b56, U+7b97, U+7bc7, U+7c73, U+7d20, U+7eaa, U+7ec8, U+7edd, U+7eed, U+7efc, U+7fa4, U+804c, U+8058, U+80cc, U+8111, U+817e, U+826f, U+8303, U+843d, U+89c9, U+89d2, U+8ba2, U+8bbf, U+8bc9, U+8bcd, U+8be6, U+8c22, U+8c61, U+8d22, U+8d26-8d27, U+8d8a, U+8f6f, U+8f7b, U+8f83, U+8f91, U+8fb9, U+8fd4, U+8fdc, U+9002, U+94b1, U+9519, U+95ed, U+961f, U+9632-9633, U+963f, U+968f-9690, U+96be, U+9876, U+9884, U+98de, U+9988, U+9999, U+9ec4, U+ff1b;
}

@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/noto-serif-sc-cjk-subset-4.woff2") format('woff2');
  unicode-range: U+2b, U+40, U+3000, U+300a-300b, U+4e16, U+4e66, U+4e70, U+4e91-4e92, U+4e94, U+4e9b, U+4ec0, U+4eca, U+4f01, U+4f17-4f18, U+4f46, U+4f4e, U+4f9b, U+4fee, U+503c, U+5065, U+50cf, U+513f, U+5148, U+518d, U+51c6, U+51e0, U+5217, U+529e-529f, U+5341, U+534f, U+5361, U+5386, U+53c2, U+53c8, U+53cc, U+53d7-53d8, U+53ea, U+5404, U+5411, U+5417, U+5427, U+5468, U+559c, U+5668, U+56e0, U+56e2, U+56ed, U+5740, U+57fa, U+58eb, U+5904, U+592a, U+59cb, U+5a31, U+5b58, U+5b9d, U+5bc6, U+5c71, U+5dde, U+5df1, U+5e08, U+5e26, U+5e2e, U+5e93, U+5e97, U+5eb7, U+5f15, U+5f20, U+5f3a, U+5f62, U+5f69, U+5f88, U+5f8b, U+5fc5, U+600e, U+620f, U+6218, U+623f, U+627e, U+628a, U+62a4, U+62db, U+62e9, U+6307, U+6362, U+636e, U+64ad, U+6539, U+653f, U+6548, U+6574, U+6613, U+6625, U+663e, U+666f, U+672a, U+6750, U+6784, U+6a21, U+6b3e, U+6b65, U+6bcf, U+6c11, U+6c5f, U+6df1, U+706b, U+7167, U+724c, U+738b, U+73a9, U+73af, U+7403, U+7537, U+754c, U+7559, U+767d, U+7740, U+786e, U+795e, U+798f, U+79f0, U+7aef, U+7b7e, U+7bb1, U+7ea2, U+7ea6, U+7ec4, U+7ec6, U+7ecd, U+7edc, U+7ef4, U+8003, U+80b2, U+81f3-81f4, U+822a, U+827a, U+82f1, U+83b7, U+8425, U+89c2, U+89c8, U+8ba9, U+8bb8, U+8bc6, U+8bd5, U+8be2, U+8be5, U+8bed, U+8c03, U+8d23, U+8d2d, U+8d34, U+8d70, U+8db3, U+8fbe, U+8fce, U+8fd1, U+8fde, U+9001, U+901f-9020, U+90a3, U+914d, U+91c7, U+94fe, U+9500, U+952e, U+9605, U+9645, U+9662, U+9664, U+9700, U+9752, U+975e, U+97f3, U+9879, U+9886, U+98df, U+9a6c, U+9a8c, U+9ed1, U+9f99;
}

@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/noto-serif-sc-cjk-subset-1.woff2") format('woff2');
  unicode-range: U+4e, U+201c-201d, U+3010-3011, U+4e07, U+4e1c, U+4e24, U+4e3e, U+4e48, U+4e50, U+4e5f, U+4e8b-4e8c, U+4ea4, U+4eab-4eac, U+4ecb, U+4ece, U+4ed6, U+4ee3, U+4ef6-4ef7, U+4efb, U+4f20, U+4f55, U+4f7f, U+4fdd, U+505a, U+5143, U+5149, U+514d, U+5171, U+5177, U+518c, U+51fb, U+521b, U+5229, U+522b, U+52a9, U+5305, U+5317, U+534e, U+5355, U+5357, U+535a, U+5373, U+539f, U+53bb, U+53ca, U+53cd, U+53d6, U+53e3, U+53f0, U+5458, U+5546, U+56db, U+573a, U+578b, U+57ce, U+58f0, U+590d, U+5934, U+5973, U+5b57, U+5b8c, U+5b98, U+5bb9, U+5bfc, U+5c06, U+5c11, U+5c31, U+5c55, U+5df2, U+5e03, U+5e38, U+5e76, U+5e94, U+5efa, U+5f71, U+5f97, U+5feb, U+6001, U+603b, U+60f3, U+611f, U+6216, U+624d, U+6253, U+6295, U+6301, U+6392, U+641c, U+652f, U+653e, U+6559, U+6599, U+661f, U+671f, U+672f, U+6761, U+67e5, U+6807, U+6837, U+683c, U+6848, U+6b22, U+6b64, U+6bd4, U+6c14, U+6c34, U+6c42, U+6ca1, U+6d41, U+6d77, U+6d88, U+6e05, U+6e38, U+6e90, U+7136, U+7231, U+7531, U+767e, U+76ee, U+76f4, U+771f, U+7801, U+793a, U+79cd, U+7a0b, U+7a7a, U+7acb, U+7ae0, U+7b2c, U+7b80, U+7ba1, U+7cbe, U+7d22, U+7ea7, U+7ed3, U+7ed9, U+7edf, U+7f16, U+7f6e, U+8001, U+800c, U+8272, U+8282, U+82b1, U+8350, U+88ab, U+88c5, U+897f, U+89c1, U+89c4, U+89e3, U+8a00, U+8ba1, U+8ba4, U+8bae-8bb0, U+8bbe, U+8bc1, U+8bc4, U+8bfb, U+8d28, U+8d39, U+8d77, U+8d85, U+8def, U+8eab, U+8f66, U+8f6c, U+8f7d, U+8fd0, U+9009, U+90ae, U+90fd, U+91cc-91cd, U+91cf, U+95fb, U+9650, U+96c6, U+9891, U+98ce, U+ff1f;
}

@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/noto-serif-sc-cjk-subset-3.woff2") format('woff2');
  unicode-range: U+d, U+3e, U+5f, U+7c, U+a0, U+a9, U+4e09-4e0b, U+4e0d-4e0e, U+4e13, U+4e1a, U+4e2a, U+4e3a-4e3b, U+4e4b, U+4e86, U+4e8e, U+4ea7, U+4eba, U+4ee4-4ee5, U+4eec, U+4f1a, U+4f4d, U+4f53, U+4f5c, U+4f60, U+4fe1, U+5165, U+5168, U+516c, U+5173, U+5176, U+5185, U+51fa, U+5206, U+5230, U+5236, U+524d, U+529b, U+52a0-52a1, U+52a8, U+5316, U+533a, U+53cb, U+53d1, U+53ef, U+53f7-53f8, U+5408, U+540c-540e, U+544a, U+548c, U+54c1, U+56de, U+56fd-56fe, U+5728, U+5730, U+5907, U+5916, U+591a, U+5927, U+5929, U+597d, U+5982, U+5b50, U+5b66, U+5b89, U+5b9a, U+5b9e, U+5ba2, U+5bb6, U+5bf9, U+5c0f, U+5de5, U+5e02, U+5e73-5e74, U+5e7f, U+5ea6, U+5f00, U+5f0f, U+5f53, U+5f55, U+5fae, U+5fc3, U+6027, U+606f, U+60a8, U+60c5, U+610f, U+6210-6211, U+6237, U+6240, U+624b, U+6280, U+62a5, U+63a5, U+63a8, U+63d0, U+6536, U+6570, U+6587, U+65b9, U+65e0, U+65f6, U+660e, U+662d, U+662f, U+66f4, U+6700, U+670d, U+672c, U+673a, U+6743, U+6765, U+679c, U+682a, U+6b21, U+6b63, U+6cbb, U+6cd5, U+6ce8, U+6d3b, U+70ed, U+7247-7248, U+7269, U+7279, U+73b0, U+7406, U+751f, U+7528, U+7535, U+767b, U+76f8, U+770b, U+77e5, U+793e, U+79d1, U+7ad9, U+7b49, U+7c7b, U+7cfb, U+7ebf, U+7ecf, U+7f8e, U+8005, U+8054, U+80fd, U+81ea, U+85cf, U+884c, U+8868, U+8981, U+89c6, U+8bba, U+8bdd, U+8bf4, U+8bf7, U+8d44, U+8fc7, U+8fd8-8fd9, U+8fdb, U+901a, U+9053, U+90e8, U+91d1, U+957f, U+95e8, U+95ee, U+95f4, U+9762, U+9875, U+9898, U+9996, U+9ad8, U+ff01, U+ff08-ff09;
}

@font-face {
  font-family: 'Noto Serif SC';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/noto-serif-sc-cjk-subset-5.woff2") format('woff2');
  unicode-range: U+20-22, U+27-2a, U+2c-3b, U+3f, U+41-4d, U+4f-5d, U+61-7b, U+7d, U+ab, U+ae, U+b2, U+b7, U+bb, U+df-e5, U+e7-ea, U+ec-ed, U+f1-f4, U+f6, U+f9-fa, U+fc, U+101, U+103, U+113, U+12b, U+148, U+14d, U+16b, U+1ce, U+1d0, U+300-301, U+1ebf, U+1ec7, U+2013-2014, U+2022, U+2027, U+2039-203a, U+2122, U+3001-3002, U+3042, U+3044, U+3046, U+3048, U+304a-3055, U+3057, U+3059-305b, U+305d, U+305f-3061, U+3063-306b, U+306d-3073, U+3075-3076, U+3078-3079, U+307b, U+307e-307f, U+3081-308d, U+308f, U+3092-3093, U+30a1-30a4, U+30a6-30bb, U+30bd, U+30bf-30c1, U+30c3-30c4, U+30c6-30cb, U+30cd-30d7, U+30d9-30e1, U+30e3-30e7, U+30e9-30ed, U+30ef, U+30f3, U+30fb-30fc, U+3127, U+4e00, U+4e2d, U+65b0, U+65e5, U+6708-6709, U+70b9, U+7684, U+7f51, U+ff0c, U+ff0e, U+ff1a;
}

:root {
      --bg:     #F1EADB;
      --paper:  #F6F0E2;
      --ink:    #1B1411;
      --soft:   #6A5849;
      --softer: #8C7B6A;
      --accent: #923321;       /* oxblood */
      --rule:   rgba(27,20,17,0.16);
      --hair:   rgba(27,20,17,0.10);

      --serif: "Newsreader", "Noto Serif SC", Georgia, serif;
      --serif-cn: "Noto Serif SC", "Newsreader", serif;
      --mono:  "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
    }

    * { box-sizing: border-box; }
    html, body { margin: 0; padding: 0; }
    body {
      background: var(--bg);
      color: var(--ink);
      font-family: var(--serif);
      font-size: 18px;
      line-height: 1.55;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
    }
    a { color: inherit; }

    /* ── page frame ─────────────────────────────────────────────── */
    .page {
      max-width: 780px;
      margin: 0 auto;
      padding: 72px 56px 96px;
      position: relative;
    }
    @media (min-width: 1100px) {
      .page { padding: 96px 56px 120px; }
    }

    /* ── top eyebrow ────────────────────────────────────────────── */
    .topbar {
      display: flex;
      justify-content: space-between;
      align-items: baseline;
      font-family: var(--mono);
      font-size: 11px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--softer);
      margin-bottom: 96px;
    }
    .topbar .mark { color: var(--ink); }

    /* ── thesis / lede ──────────────────────────────────────────── */
    .lede {
      font-family: var(--serif);
      font-weight: 300;
      font-style: italic;
      font-size: 52px;
      line-height: 1.08;
      letter-spacing: -0.018em;
      margin: 0 0 18px;
      text-wrap: balance;
    }
    .lede em { font-style: normal; color: var(--accent); }

    .lede-cn {
      font-family: var(--serif-cn);
      font-weight: 300;
      font-size: 17px;
      line-height: 1.7;
      color: var(--soft);
      margin: 0;
      letter-spacing: 0.04em;
      max-width: 600px;
    }

    /* ── rule ───────────────────────────────────────────────────── */
    .rule { border: 0; border-top: 1px solid var(--rule); margin: 48px 0; }
    .rule-thin { border: 0; border-top: 1px solid var(--hair); margin: 36px 0; }

    /* ── figure ─────────────────────────────────────────────────── */
    .figure { margin: 0; }
    .figure-eyebrow {
      font-family: var(--mono);
      font-size: 10px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--softer);
      display: flex;
      justify-content: space-between;
      margin-bottom: 22px;
    }
    .figure svg { width: 100%; height: auto; display: block; overflow: visible; }
    .figcaption {
      font-family: var(--serif);
      font-style: italic;
      font-size: 13.5px;
      color: var(--soft);
      text-align: center;
      margin-top: 18px;
      letter-spacing: 0.01em;
    }

    /* stats block under figure */
    .stats {
      margin-top: 36px;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 32px;
      padding-top: 28px;
      border-top: 1px solid var(--hair);
    }
    .stat-num {
      font-family: var(--serif);
      font-weight: 300;
      font-size: 44px;
      line-height: 1;
      letter-spacing: -0.02em;
      color: var(--ink);
    }
    .stat-num .accent { color: var(--accent); }
    .stat-sup {
      font-size: 0.55em;
      vertical-align: super;
      color: var(--soft);
      letter-spacing: 0;
      margin-left: 1px;
    }
    .stat-label {
      font-family: var(--serif);
      font-style: italic;
      font-size: 14.5px;
      color: var(--soft);
      margin-top: 12px;
      max-width: 24ch;
      line-height: 1.45;
    }

    /* ── body paragraph with drop cap ──────────────────────────── */
    .body {
      font-family: var(--serif);
      font-size: 19px;
      line-height: 1.62;
      color: var(--ink);
      margin: 0;
      text-wrap: pretty;
    }
    .dropcap {
      font-family: var(--serif);
      font-size: 19px;
      line-height: 1.62;
      color: var(--ink);
      margin: 0;
      text-wrap: pretty;
    }
    .dropcap > .cap {
      float: left;
      font-family: var(--serif);
      font-weight: 400;
      font-size: 86px;
      line-height: 0.82;
      padding: 8px 12px 0 0;
      color: var(--accent);
      font-feature-settings: "lnum" 1;
    }
    .body-cn {
      font-family: var(--serif-cn);
      font-size: 15.5px;
      line-height: 1.8;
      color: var(--soft);
      margin: 20px 0 0;
      letter-spacing: 0.03em;
    }

    /* ── signature ──────────────────────────────────────────────── */
    .signature {
      margin-top: 48px;
      text-align: right;
      font-family: var(--serif);
    }
    .signature .dash {
      color: var(--softer);
      margin-right: 8px;
    }
    .signature .name-en {
      font-style: italic;
      font-weight: 400;
      font-size: 22px;
      color: var(--ink);
      letter-spacing: 0.005em;
    }
    .signature .name-cn {
      display: block;
      font-family: var(--serif-cn);
      font-size: 15px;
      color: var(--soft);
      margin-top: 6px;
      letter-spacing: 0.12em;
    }

    /* ── elsewhere / connect ────────────────────────────────────── */
    .elsewhere-heading {
      font-family: var(--serif);
      font-style: italic;
      font-size: 13px;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      color: var(--soft);
      margin: 0 0 28px;
    }
    .channels {
      margin: 0;
      display: grid;
      grid-template-columns: 100px 1fr auto;
      column-gap: 28px;
      row-gap: 0;
      font-size: 17px;
    }
    .channels dt {
      font-family: var(--serif);
      font-style: italic;
      color: var(--soft);
      padding: 14px 0;
      border-bottom: 1px solid var(--hair);
    }
    .channels dd {
      margin: 0;
      padding: 14px 0;
      border-bottom: 1px solid var(--hair);
    }
    .channels dd a {
      color: var(--ink);
      text-decoration: none;
      border-bottom: 1px solid transparent;
      transition: border-color 0.15s;
    }
    .channels dd a:hover { border-bottom-color: var(--soft); }
    .channels .arrow {
      padding: 14px 0;
      color: var(--softer);
      font-family: var(--mono);
      font-size: 13px;
      border-bottom: 1px solid var(--hair);
      text-align: right;
    }
    .channels .qr-row dt { align-self: start; padding-top: 18px; border-bottom: 0; }
    .channels .qr-row dd { padding: 14px 0 0; border-bottom: 0; }
    .channels .qr-row .arrow { border-bottom: 0; }
    .qr-wrap {
      display: flex;
      align-items: flex-start;
      gap: 16px;
    }
    .qr-note {
      font-family: var(--serif);
      font-style: italic;
      font-size: 13px;
      color: var(--softer);
      line-height: 1.5;
      padding-top: 4px;
    }

    /* ── byline: portrait + name + icon row ─────────────────────── */
    .byline {
      display: flex;
      align-items: center;
      gap: 20px;
      flex-wrap: wrap;
    }
    .byline-text {
      flex: 0 1 auto;
      min-width: 0;
    }
    .byline-name {
      font-family: var(--serif);
      font-style: italic;
      font-weight: 400;
      font-size: 22px;
      color: var(--ink);
      letter-spacing: 0.005em;
      line-height: 1.2;
    }
    .byline-meta {
      font-family: var(--serif-cn);
      font-size: 13.5px;
      color: var(--soft);
      margin-top: 6px;
      letter-spacing: 0.08em;
    }

    /* ── icon row ──────────────────────────────────────────────── */
    .icons {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-left: auto;
    }
    .ico {
      width: 36px;
      height: 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--soft);
      border-radius: 4px;
      transition: color 0.15s ease, background 0.15s ease, transform 0.15s ease;
      text-decoration: none;
      position: relative;
      cursor: pointer;
    }
    .ico:hover {
      color: var(--accent);
      background: rgba(146, 51, 33, 0.06);
    }
    .ico:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }
    .ico svg { width: 22px; height: 22px; display: block; }

    /* ── 小红书 hover popover ──────────────────────────────────── */
    .ico-xhs .qr-pop {
      position: absolute;
      bottom: calc(100% + 14px);
      left: 50%;
      transform: translateX(-50%) translateY(6px);
      background: var(--paper);
      border: 1px solid var(--rule);
      padding: 14px 14px 10px;
      box-shadow: 0 14px 36px rgba(27, 20, 17, 0.14);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.18s ease, transform 0.18s ease;
      z-index: 20;
      white-space: nowrap;
    }
    .ico-xhs .qr-pop::after {
      content: "";
      position: absolute;
      top: 100%;
      left: 50%;
      width: 10px;
      height: 10px;
      background: var(--paper);
      border-right: 1px solid var(--rule);
      border-bottom: 1px solid var(--rule);
      transform: translate(-50%, -50%) rotate(45deg);
    }
    .ico-xhs:hover .qr-pop,
    .ico-xhs:focus-within .qr-pop {
      opacity: 1;
      pointer-events: auto;
      transform: translateX(-50%) translateY(0);
    }
    .qr-pop .qr-cap {
      font-family: var(--serif);
      font-style: italic;
      font-size: 12px;
      color: var(--soft);
      text-align: center;
      margin-top: 10px;
      letter-spacing: 0.04em;
    }

    /* portrait slot (image) */
    #portrait {
      width: 84px;
      height: 84px;
      border: 1px solid var(--rule);
      background: #fff;
      border-radius: 50%;
      object-fit: cover;
      flex: 0 0 auto;
      box-shadow: 0 2px 12px rgba(27, 20, 17, 0.08);
    }

    #xhs-qr {
      width: 148px;
      height: 148px;
      background: #fff;
      border: 1px solid var(--rule);
      display: block;
      border-radius: 2px;
      object-fit: contain;
    }

    /* ── footer ────────────────────────────────────────────────── */
    .footer {
      margin-top: 96px;
      padding-top: 28px;
      border-top: 1px solid var(--rule);
      font-family: var(--mono);
      font-size: 10.5px;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--softer);
    }

    /* ── decorative paper texture (very subtle) ────────────────── */
    body::before {
      content: "";
      position: fixed; inset: 0;
      pointer-events: none;
      background:
        radial-gradient(1200px 600px at 20% 0%, rgba(255,255,255,0.35), transparent 60%),
        radial-gradient(900px 500px at 100% 100%, rgba(146,51,33,0.04), transparent 60%);
      z-index: 0;
    }
    .page { position: relative; z-index: 1; }