@font-face { font-family: "Lora"; src: url("assets/fonts/lora-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
  @font-face { font-family: "Lora"; src: url("assets/fonts/lora-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
  @font-face { font-family: "Playwrite"; src: url("assets/fonts/playwrite-nz-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
  /* The Chinese hand: 辰宇落雁體, cut to web size by scripts/build-cjk-subsets.py.
     One file holds the characters this site writes; the rest of everyday
     Traditional Chinese is sliced by unicode-range, so a browser fetches a slice
     only when someone actually types a character in it. Playwrite is listed first
     in every stack, so Latin keeps its own hand and CJK falls through to this. */
/* inkhand:start */
  /* generated by scripts/build-cjk-subsets.py — do not edit by hand */
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-00.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+3005, U+3041-3093, U+309D-309E, U+30A1-30A7, U+30FE, U+4E01, U+4E08, U+4E10-4E11, U+4E15-4E16, U+4E18-4E19, U+4E1E, U+4E2B, U+4E30, U+4E32, U+4E38-4E39, U+4E3B, U+4E43, U+4E48, U+4E4D-4E4F, U+4E52-4E53, U+4E56, U+4E58-4E59, U+4E5D-4E5E, U+4E69, U+4E73, U+4E7E, U+4E88, U+4E8E, U+4E91-4E92, U+4E95, U+4E99, U+4E9E-4E9F, U+4EA1-4EA2, U+4EA4-4EA6, U+4EA8, U+4EAC-4EAE, U+4EB3, U+4EC1, U+4EC3-4EC4, U+4EC6-4EC7, U+4ECB, U+4ECD, U+4ED4-4ED5, U+4ED7-4ED9, U+4EDE-4EDF, U+4EE3-4EE4, U+4EF0, U+4EF2-4EF3, U+4EFD, U+4EFF, U+4F01, U+4F09-4F0A; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-01.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+4F0B, U+4F0D, U+4F0F-4F11, U+4F15, U+4F19, U+4F2F-4F30, U+4F34, U+4F36, U+4F38, U+4F3C-4F3D, U+4F43, U+4F47-4F48, U+4F4D, U+4F50-4F51, U+4F54, U+4F57, U+4F59-4F5B, U+4F5D-4F5E, U+4F63, U+4F69, U+4F6C, U+4F6F-4F70, U+4F73, U+4F75, U+4F7A-4F7B, U+4F7E-4F7F, U+4F83, U+4F88, U+4F8B, U+4F8D, U+4F8F, U+4F91, U+4F96, U+4F9B, U+4F9D, U+4FAE-4FAF, U+4FB5-4FB7, U+4FC2-4FC4, U+4FCA, U+4FCE-4FD1, U+4FD7-4FD8, U+4FDA, U+4FDE-4FE0, U+4FEE-4FEF, U+4FF1, U+4FF3, U+4FF8, U+4FFA, U+4FFE, U+5000, U+5006, U+5009, U+500C-500D, U+500F, U+5014, U+5016, U+5018, U+501A, U+501F, U+5021, U+5023, U+5025-5026, U+5028-502B, U+502D, U+5043, U+5047, U+5049, U+504C, U+504E, U+5055, U+5065, U+506D, U+506F, U+5074-5077, U+507A, U+507D, U+5080, U+508D, U+5091, U+5096, U+5098, U+509A, U+50A2, U+50AC-50AD, U+50AF, U+50B2, U+50B5, U+50B7, U+50BB, U+50BE, U+50C5, U+50C7, U+50CE, U+50D1, U+50D5-50D6, U+50DA, U+50E5, U+50E7, U+50E9, U+50ED-50EE, U+50F1, U+50F5, U+50FB, U+5102, U+5104-5105, U+5108-5109, U+5110, U+5112, U+5114, U+5118, U+511F, U+5121, U+512A, U+5133, U+5137-5138, U+513B-513C, U+513F-5141, U+5143-5147, U+514B-514D; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-02.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+5152, U+5154-5155, U+5157, U+515C, U+5162, U+516C-516E, U+5171, U+5175, U+5178, U+517C, U+5180, U+5189-518A, U+5191-5192, U+5195, U+5197, U+51A0, U+51A2, U+51A4-51A5, U+51AA, U+51AC, U+51B0, U+51B6-51B7, U+51BD, U+51C6, U+51CB-51CD, U+51DC-51DD, U+51E0-51E1, U+51F0-51F1, U+51F3, U+51F6, U+51F8-51F9, U+51FD, U+5200-5201, U+5203, U+5207-5208, U+520A, U+520E, U+5211-5212, U+5216, U+5224, U+5228-5229, U+522E, U+5237-5238, U+523A, U+5241, U+5243, U+524A-524C, U+524E, U+5254, U+5256, U+525C-525D, U+5269-526A, U+526F, U+5272, U+5274-5275, U+5277, U+527D, U+527F, U+5282, U+5287-528A, U+528D, U+5291, U+5293, U+52A0, U+52A3, U+52AA-52AC, U+52BB, U+52BE, U+52C1, U+52C3, U+52C7, U+52C9, U+52D2, U+52D7-52D8, U+52DB, U+52DD-52DF, U+52E3-52E4, U+52E6, U+52F0, U+52F3, U+52F5, U+52F8, U+52FA-52FB, U+52FE-52FF, U+5306, U+5308, U+530D, U+530F-5310, U+5315, U+5317, U+5319, U+531D, U+5320-5321, U+5323, U+532A, U+532F, U+5331, U+5339, U+533E-5340, U+5343, U+5345, U+5347-5349, U+5351-5354, U+5357, U+535A, U+535C, U+535E, U+5360, U+5366, U+536E-536F, U+5371, U+5373, U+5375, U+5377-5379, U+537B, U+537F, U+5384, U+539A, U+539D, U+53A5; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-03.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+53AD, U+53B2, U+53C3, U+53C8-53CB, U+53D4, U+53DB, U+53DF, U+53E2-53E4, U+53E8-53E9, U+53EB-53EE, U+53F1-53F2, U+53F5, U+53F8, U+53FB-53FC, U+5401, U+5403-5404, U+5406, U+5408-540B, U+540E-5412, U+541B, U+541D-5420, U+5426, U+5429, U+542B-542E, U+5431, U+5433, U+5435-5436, U+5438-5439, U+543B-543C, U+543E, U+5440, U+5442-5443, U+5446, U+5448, U+544A, U+544E, U+5462, U+5468, U+5471, U+5473, U+5475-5478, U+547B-547D, U+5480, U+5484, U+5486, U+548B, U+548E, U+5490, U+5492, U+5495-5496, U+549A, U+54A6-54AC, U+54AF, U+54B1, U+54B3, U+54B8, U+54BB, U+54BD, U+54BF-54C0, U+54C2, U+54C4, U+54C7-54C9, U+54CE, U+54E1, U+54E5-54E6, U+54E8-54E9, U+54ED-54EE, U+54F2, U+54FA, U+54FC-54FD, U+5501, U+5506-5507, U+5509, U+550F-5510, U+5514, U+5527, U+552C, U+552E, U+5531, U+5533, U+5537-5538, U+553E, U+5541, U+5543-5544, U+5546, U+554A, U+5555-5557, U+555C, U+555E, U+5561, U+5563-5564, U+5566, U+556A, U+557B-557C, U+557E, U+5580, U+5582-5584, U+5587, U+5589-558B, U+5594, U+5598-559A, U+559D, U+559F, U+55A7; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-04.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+55AA-55AC, U+55AE, U+55B1-55B3, U+55BB, U+55C5-55C7, U+55C9, U+55D1, U+55D3, U+55DA, U+55DC, U+55DF, U+55E1, U+55E3-55E6, U+55E8, U+55EF, U+55F6-55F7, U+55FD-55FE, U+5600, U+5606, U+5608-5609, U+560D-560E, U+5610, U+5614, U+5616, U+561B, U+561F, U+5629, U+562E-5630, U+5632, U+5634, U+5636, U+5639, U+563B, U+563F, U+564E, U+5653, U+5657, U+5659, U+5662, U+5664-5665, U+5669-566C, U+566F, U+5671, U+5674, U+5676, U+5678-5679, U+5680, U+5685, U+5687, U+568E-5690, U+5695, U+56A5, U+56A8, U+56AE, U+56B4, U+56B6-56B7, U+56BC, U+56C0-56C2, U+56C8-56C9, U+56CC, U+56D1, U+56DA, U+56DD, U+56E4, U+56EA-56EB, U+56F0, U+56FA, U+56FF, U+5703-5704, U+5708-5709, U+570B, U+570D, U+5712-5713, U+571F, U+5729, U+572C-572D, U+572F, U+5733, U+573B, U+5747, U+574A, U+574D-574F, U+5751, U+5761, U+5764, U+5766, U+5769-576A, U+5777, U+577C, U+5782, U+5793, U+57A0, U+57A2-57A3, U+57AE, U+57C2-57C3, U+57CB, U+57CE, U+57D4, U+57DF-57E0, U+57E4, U+57F7, U+57F9-57FA, U+5802, U+5805, U+5809-580A, U+581D, U+5820-5821, U+5824, U+582A, U+582F-5830, U+5835, U+584A-584C, U+5851-5852, U+5854, U+5857-5858, U+585A, U+585E, U+5862, U+586B, U+586D, U+5875; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-05.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+5879, U+587D-587E, U+5880, U+5883, U+5885, U+588A, U+5893, U+589C, U+589E-589F, U+58A6, U+58A9, U+58AE, U+58B3, U+58BE, U+58C1, U+58C5, U+58C7, U+58CE, U+58D1, U+58D3, U+58D5, U+58D8-58D9, U+58DF, U+58E2, U+58E4, U+58E9, U+58EB-58EC, U+58EF, U+58F9-58FA, U+58FD, U+590F, U+5914-5915, U+5919, U+5922, U+5924-5925, U+592B, U+592D-592E, U+5937-5938, U+593E, U+5944, U+5947-5949, U+594E-5951, U+5954-5955, U+5958, U+595A, U+5960, U+5962, U+5967, U+5969-596A, U+596D-596E, U+5973-5974, U+5976, U+5978-5979, U+5981, U+5983-5984, U+598A, U+598D, U+5992-5993, U+5996, U+5999, U+599D-599E, U+59A3-59A5, U+59A8, U+59AE-59AF, U+59B3, U+59B9, U+59BB, U+59BE, U+59C5-59C6, U+59CA, U+59CD, U+59D0-59D4, U+59D8, U+59DA, U+59DC, U+59E3, U+59E5-59E6, U+59E8, U+59EA, U+59EC, U+59FB, U+59FF, U+5A01, U+5A03, U+5A09, U+5A0C, U+5A11, U+5A13, U+5A18, U+5A1B-5A1C, U+5A1F-5A20, U+5A23, U+5A25, U+5A29, U+5A36, U+5A3C, U+5A40-5A41, U+5A46, U+5A49-5A4A, U+5A5A, U+5A62, U+5A66, U+5A6A, U+5A77, U+5A7F, U+5A92, U+5A9A-5A9B, U+5AA7, U+5AB2-5AB3, U+5ABC-5ABE, U+5AC1-5AC2, U+5AC9, U+5ACC, U+5AD6-5AD8, U+5AE1, U+5AE3, U+5AE6, U+5AE9, U+5AF5, U+5AFB, U+5B08-5B09, U+5B0B-5B0C; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-06.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+5B1D, U+5B24, U+5B2A, U+5B30, U+5B34, U+5B38, U+5B40, U+5B43, U+5B51, U+5B53-5B55, U+5B5A-5B5D, U+5B5F, U+5B63-5B64, U+5B69, U+5B6B, U+5B70-5B71, U+5B73, U+5B75, U+5B7A, U+5B7D, U+5B7F, U+5B85, U+5B87-5B88, U+5B8B, U+5B8F, U+5B97-5B99, U+5B9B-5B9C, U+5BA2-5BA6, U+5BAE, U+5BB0, U+5BB3-5BB5, U+5BB8, U+5BBF, U+5BC2, U+5BC5, U+5BC7, U+5BCC, U+5BD0, U+5BD2-5BD3, U+5BDE-5BDF, U+5BE1-5BE2, U+5BE4-5BE5, U+5BE7-5BE8, U+5BEC, U+5BEE, U+5BF0, U+5BF5-5BF6, U+5BF8, U+5BFA, U+5C04, U+5C07-5C0B, U+5C0E, U+5C16, U+5C1A, U+5C22, U+5C24, U+5C2C, U+5C37-5C3A, U+5C3C, U+5C3F-5C41, U+5C45-5C46, U+5C48, U+5C4B, U+5C4D-5C51, U+5C58, U+5C5C-5C5D, U+5C60, U+5C62, U+5C65, U+5C68, U+5C6F, U+5C71, U+5C79, U+5C8C, U+5C90-5C91, U+5C94, U+5CA1, U+5CA9, U+5CAB, U+5CB1, U+5CB3, U+5CB7-5CB8, U+5CD2, U+5CD9, U+5CE8, U+5CEA, U+5CED, U+5CF0, U+5CF4, U+5CF6, U+5CFB, U+5CFD, U+5D01, U+5D06-5D07, U+5D0E, U+5D11, U+5D14, U+5D16-5D17, U+5D19, U+5D1B, U+5D22, U+5D24, U+5D27, U+5D29, U+5D34, U+5D47, U+5D4C, U+5D50, U+5D69, U+5D6F, U+5D84, U+5D87, U+5D94, U+5D9D, U+5DB8, U+5DBA, U+5DBC-5DBD, U+5DC9, U+5DCD, U+5DD2, U+5DD4, U+5DD6, U+5DDD; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-07.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+5DDE, U+5DE1-5DE2, U+5DE5, U+5DE7-5DE8, U+5DEB, U+5DF3-5DF4, U+5DF7, U+5DFD-5DFE, U+5E02, U+5E06, U+5E0C, U+5E11, U+5E15-5E16, U+5E18, U+5E1A-5E1B, U+5E1D, U+5E1F, U+5E25, U+5E2B, U+5E2D, U+5E37, U+5E3D, U+5E40, U+5E43, U+5E45, U+5E4C, U+5E54-5E55, U+5E57, U+5E5B, U+5E5F, U+5E61-5E63, U+5E72, U+5E74, U+5E76, U+5E78-5E79, U+5E7B-5E7D, U+5E87, U+5E8A, U+5E95-5E97, U+5E9A, U+5E9C, U+5EA0, U+5EA7, U+5EAB, U+5EAD, U+5EB5-5EB8, U+5EBE, U+5EC1-5EC2, U+5EC4, U+5EC8-5ECA, U+5ED3, U+5ED6, U+5EDA, U+5EDD, U+5EDF-5EE0, U+5EE2-5EE3, U+5EEC, U+5EF3, U+5EF6-5EF7, U+5EFE-5EFF, U+5F01, U+5F04, U+5F08, U+5F0A-5F0B, U+5F12-5F15, U+5F17-5F18, U+5F1B, U+5F1F, U+5F26-5F27, U+5F29, U+5F2D, U+5F31, U+5F37, U+5F3C, U+5F46, U+5F48, U+5F4A, U+5F4C, U+5F4E, U+5F57, U+5F59, U+5F5D, U+5F64-5F65, U+5F6A-5F6D, U+5F70-5F71, U+5F77, U+5F79, U+5F7C, U+5F7F-5F81, U+5F87, U+5F89-5F8B, U+5F90-5F92, U+5F98-5F99, U+5F9C, U+5F9E, U+5FA0-5FA1, U+5FA8-5FAA, U+5FAC, U+5FAE, U+5FB5, U+5FB7, U+5FB9, U+5FBD, U+5FCC-5FCD, U+5FD6-5FD9, U+5FDD, U+5FE0, U+5FEA, U+5FF1, U+5FF8, U+5FFD, U+5FFF, U+600F, U+6012, U+6014-6016; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-08.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+601B, U+601D, U+6020-6021, U+6025, U+6028-6029, U+602B, U+602F, U+6035, U+6043, U+6046, U+604D, U+6050, U+6055, U+6059, U+6062-6065, U+6068, U+606A-606D, U+606F-6070, U+607F, U+6084-6085, U+6089, U+608C-608D, U+6094, U+6096, U+609A, U+609F-60A0, U+60A3, U+60A8, U+60B2, U+60B4-60B6, U+60B8, U+60BB-60BD, U+60C6-60C7, U+60CB, U+60D1, U+60D5, U+60D8, U+60DA, U+60DC, U+60DF-60E1, U+60E6, U+60F0-60F1, U+60F4, U+60F6, U+60F9-60FB, U+6100-6101, U+6106, U+6108-6109, U+610D-610E, U+6112, U+6115, U+611A, U+611C, U+6123, U+6127, U+6134, U+6137, U+613E-613F, U+6144, U+6147-6148, U+614C-614E, U+6155, U+6158, U+615A, U+615D, U+615F, U+6163, U+6167-6168, U+616B, U+616E, U+6170, U+6175-6177, U+617C, U+617E, U+6182, U+618A, U+618E, U+6190-6191, U+6194, U+619A, U+61A4, U+61A7, U+61A9, U+61AB-61AC, U+61AE, U+61B2, U+61B6, U+61BE, U+61C2, U+61C7-61CB, U+61CD, U+61E3, U+61E6, U+61F2, U+61F5-61F8, U+61FA, U+61FC, U+61FE-6200, U+6208, U+620A, U+620C-620E, U+6212, U+6215, U+621A-621B, U+621F, U+6221-6222, U+622E, U+6230, U+6232-6234, U+6236, U+623E-623F, U+6241, U+6247-6249, U+624E; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-09.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+6251-6252, U+6254, U+6258, U+625B, U+6263, U+626D-626F, U+6273, U+6276, U+6279, U+627C, U+627F-6280, U+6284, U+6286, U+6289, U+6291-6293, U+6295-6298, U+62A8, U+62AB-62AC, U+62B1, U+62B5, U+62B9, U+62BC-62BD, U+62BF, U+62C2, U+62C4, U+62C6-62C9, U+62CB-62CE, U+62D0, U+62D2-62D4, U+62D6-62DB, U+62ED-62EF, U+62F1, U+62F3-62F4, U+62F7, U+62FC-62FE, U+6301-6302, U+6308, U+6316, U+6328, U+632B, U+632F, U+633A, U+633D-633E, U+6342, U+6346, U+6349, U+634C-6350, U+6355, U+6367-6369, U+636B, U+6371, U+6376-6377, U+637A-637B, U+6380, U+6383-6384, U+6388, U+638C, U+638F, U+6392, U+6396, U+6398-6399, U+639B, U+63A0-63A3, U+63A7-63AA, U+63AC, U+63C0, U+63C6, U+63C9, U+63CD, U+63CF, U+63D2, U+63D6, U+63DA, U+63E1, U+63E3, U+63E9-63EA, U+63ED-63EE, U+63F9, U+6406, U+640D, U+640F, U+6413-6414, U+6416-6417, U+641C, U+641E, U+642A, U+642C-642D, U+6434, U+6436, U+643D-643E, U+6451-6452, U+6454, U+6458, U+645F, U+6467, U+6469, U+646D, U+646F, U+6478-647B, U+6487-6488, U+6492-6493, U+6499-649A, U+649E, U+64A2, U+64A4-64A5; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-10.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+64A9, U+64AB-64AC, U+64AE, U+64B0, U+64B2-64B3, U+64BB-64BC, U+64BE-64BF, U+64C1-64C2, U+64C4-64C5, U+64C7, U+64CA-64CB, U+64CD-64CE, U+64D2, U+64D4, U+64D8, U+64DA, U+64E0, U+64E2, U+64E6, U+64EC-64ED, U+64F0-64F2, U+64F4, U+64F7, U+64FA-64FB, U+64FE, U+6500, U+6506, U+650F, U+6514, U+6518-6519, U+651C-651D, U+6523-6524, U+652A-652C, U+6538, U+653B, U+6545, U+6549, U+654F, U+6554-6556, U+6558-6559, U+655D-655E, U+6562-6563, U+6566, U+656C, U+6572, U+6575, U+6577, U+6582-6583, U+6590-6591, U+6595, U+6597, U+659B-659C, U+659F, U+65A1, U+65A4-65A5, U+65A7, U+65AB-65AC, U+65AF, U+65B7, U+65BD, U+65C5, U+65CC, U+65CE-65CF, U+65D6-65D7, U+65E2, U+65E6, U+65E8, U+65EC-65ED, U+65F1, U+65FA, U+6600, U+6602, U+6606-6607, U+660A, U+660C, U+660E-660F, U+6614-6615, U+6620, U+6624-6625, U+6627-6628, U+662D, U+6631, U+6641, U+6643, U+6645, U+6649, U+664C, U+664F, U+6652, U+665D-665E, U+6664, U+6666, U+6668, U+666E, U+6674, U+6676-6677, U+667A, U+667E, U+6684, U+6687-6689, U+668D, U+6691, U+6696-6698, U+669D, U+66A2, U+66A8, U+66AE, U+66B1, U+66B4, U+66B8-66B9, U+66C4, U+66C7, U+66C9, U+66D6, U+66D9, U+66DC-66DD, U+66E0, U+66E6, U+66E9, U+66EC, U+66F0, U+66F3, U+66F7; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-11.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+66F9, U+66FC, U+66FE-66FF, U+670B, U+6714-6715, U+6717, U+671B, U+671D, U+6726-6728, U+672A-672B, U+672D-672E, U+6731, U+6734-6735, U+673D, U+6746, U+6749, U+674E-6751, U+6753, U+6756-6757, U+675C, U+675E, U+6760, U+676A, U+676D, U+676F-6770, U+6772-6773, U+6775, U+6777, U+677C, U+677E, U+6787, U+6789, U+678B, U+6790, U+6793, U+6795, U+6797, U+679A, U+679D, U+67AF-67B0, U+67B4, U+67B6, U+67B8, U+67C4, U+67CF, U+67D1-67D4, U+67D9-67DA, U+67DD-67DE, U+67E2, U+67E9, U+67EC, U+67EF, U+67F1, U+67F3-67F5, U+67FF, U+6813, U+6817-6818, U+6821, U+6829-682A, U+6838, U+683D, U+6840-6843, U+6845-6846, U+6848, U+684C, U+6850-6851, U+6853-6854, U+687F, U+6881-6883, U+6886, U+6893-6894, U+6897, U+689F, U+68A1-68A2, U+68A7-68A8, U+68AD, U+68AF-68B1, U+68B3, U+68B5, U+68C4, U+68C9, U+68CB, U+68CD, U+68D2, U+68D5, U+68D7-68D8, U+68DA, U+68DF-68E0, U+68E3, U+68E7, U+68EE, U+68F2, U+68F5, U+68F9-68FB, U+6905, U+690D-690E, U+6912, U+6930, U+694A, U+6953-6954, U+695A-695B, U+695D-695E, U+6960, U+6963, U+6968, U+696B, U+696D-696E, U+6975, U+6977, U+6979, U+6982, U+6986, U+6994-6995, U+699B-699C, U+69A3, U+69A6, U+69A8, U+69AB, U+69AD; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-12.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+69AE, U+69B4, U+69B7, U+69BB, U+69C1, U+69C3, U+69CC-69CD, U+69D0, U+69D3, U+69E8, U+69ED, U+69F3, U+69FD, U+6A01-6A02, U+6A05, U+6A0A, U+6A11, U+6A13, U+6A19, U+6A1E-6A1F, U+6A35, U+6A38-6A3A, U+6A3D, U+6A44, U+6A47-6A48, U+6A4B, U+6A58-6A59, U+6A61-6A62, U+6A7E, U+6A80, U+6A84, U+6A90, U+6A94, U+6A97, U+6A9C, U+6AA0, U+6AA3, U+6AAC, U+6AAE-6AAF, U+6AB3, U+6AB8, U+6ABB, U+6AC2-6AC3, U+6AD3, U+6ADA-6ADB, U+6ADD, U+6AE5, U+6AEC, U+6AFA-6AFB, U+6B04, U+6B10, U+6B16, U+6B20, U+6B23, U+6B32, U+6B3A, U+6B3D, U+6B47, U+6B49, U+6B4C, U+6B4E, U+6B50, U+6B59, U+6B5C, U+6B5F, U+6B62, U+6B64, U+6B66-6B67, U+6B6A, U+6B72, U+6B77-6B79, U+6B7B, U+6B7F, U+6B83, U+6B86, U+6B89-6B8A, U+6B96, U+6B98, U+6BA4, U+6BAE-6BAF, U+6BB2, U+6BB7, U+6BBA, U+6BBC, U+6BBF-6BC0, U+6BC5-6BC6, U+6BCB, U+6BCD, U+6BD2-6BD3, U+6BD7, U+6BDA-6BDB, U+6BEB-6BEC, U+6BEF, U+6BFD, U+6C05, U+6C08, U+6C0F-6C11, U+6C13, U+6C16, U+6C1B, U+6C1F, U+6C24, U+6C26-6C28, U+6C2B-6C2C, U+6C2E-6C2F, U+6C33, U+6C3E, U+6C40-6C42, U+6C4D-6C4E, U+6C50, U+6C55, U+6C57, U+6C59, U+6C5B, U+6C5D-6C61, U+6C68, U+6C6A, U+6C70, U+6C72, U+6C74, U+6C76, U+6C7A, U+6C7D-6C7E, U+6C81-6C83, U+6C85-6C86, U+6C88-6C89; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-13.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+6C8C-6C8D, U+6C90, U+6C94, U+6C96, U+6C98-6C99, U+6C9B, U+6CAB-6CAC, U+6CAE, U+6CB1, U+6CB3, U+6CB8-6CB9, U+6CBB-6CBE, U+6CC1, U+6CC4-6CC5, U+6CC9-6CCA, U+6CCC, U+6CD3, U+6CD6-6CD7, U+6CDB-6CDC, U+6CE0-6CE3, U+6CE5, U+6CE8, U+6CEF-6CF1, U+6CF3, U+6CF5, U+6D0B-6D0C, U+6D0E, U+6D17, U+6D1B, U+6D1E, U+6D25, U+6D27, U+6D29-6D2B, U+6D2E, U+6D31-6D32, U+6D35-6D36, U+6D38-6D39, U+6D3D-6D3E, U+6D59-6D5A, U+6D65-6D66, U+6D69-6D6A, U+6D6C, U+6D6E, U+6D74, U+6D77-6D79, U+6D85, U+6D87, U+6D89-6D8A, U+6D8C, U+6D8E, U+6D93-6D95, U+6DAA, U+6DAE-6DAF, U+6DB2, U+6DB5, U+6DB8, U+6DBC, U+6DBF, U+6DC4-6DC7, U+6DCB-6DCC, U+6DD1-6DD2, U+6DD8-6DDA, U+6DDE, U+6DE4, U+6DE6, U+6DE8, U+6DEA-6DEC, U+6DEE, U+6DF3, U+6DF5, U+6DF7, U+6DF9-6DFB, U+6E19-6E1B, U+6E1D, U+6E20-6E21, U+6E23-6E26, U+6E2C-6E2D, U+6E2F, U+6E32, U+6E34, U+6E38, U+6E3A, U+6E3E, U+6E43-6E44, U+6E4A, U+6E4D-6E4E, U+6E54, U+6E56, U+6E58, U+6E5B, U+6E5F, U+6E63, U+6E67, U+6E69, U+6E6E-6E6F, U+6E72, U+6E89, U+6E90, U+6E98, U+6E9C-6E9D, U+6EA2, U+6EA5, U+6EA7, U+6EAA, U+6EAF, U+6EB4, U+6EB6, U+6EBA, U+6EBC, U+6EC2, U+6EC4-6EC5; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-14.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+6EC7, U+6ECB-6ECC, U+6ED3-6ED5, U+6EEC, U+6EEF, U+6EF2, U+6EF4, U+6EF7, U+6EFE, U+6F01-6F02, U+6F06, U+6F0F, U+6F13, U+6F15, U+6F20, U+6F22-6F23, U+6F29-6F2C, U+6F2F, U+6F31-6F33, U+6F38, U+6F3E-6F3F, U+6F51, U+6F54, U+6F58, U+6F5B, U+6F5F-6F60, U+6F64, U+6F66, U+6F6D-6F70, U+6F78, U+6F7A, U+6F7C, U+6F80, U+6F84, U+6F86, U+6F88, U+6F8E, U+6F97, U+6FA0-6FA1, U+6FA4, U+6FA6-6FA7, U+6FB1, U+6FB3-6FB4, U+6FB6, U+6FB9, U+6FC1-6FC3, U+6FD5, U+6FD8, U+6FDB, U+6FDF-6FE1, U+6FE4, U+6FE9, U+6FEB-6FEC, U+6FEE-6FF1, U+6FFA, U+6FFE, U+7006, U+7009, U+700B, U+700F, U+7011, U+7015, U+7018, U+701A-701B, U+701D, U+701F, U+7028, U+7030, U+7032, U+703E, U+704C, U+7051, U+7058, U+705E, U+7063-7064, U+706B, U+7076, U+7078, U+707C-707D, U+708A, U+708E, U+7092, U+7095, U+7099, U+70A4, U+70AB-70AC, U+70AE-70AF, U+70B3, U+70B8, U+70C8, U+70CA, U+70CF, U+70D8-70D9, U+70E4, U+70EF, U+70F9, U+70FD, U+7109-710A, U+7119-711A, U+711C, U+7121, U+7126, U+7130, U+7146, U+7149, U+714C, U+714E, U+7156, U+7159, U+715C, U+715E, U+7164-7169, U+716C, U+716E, U+717D, U+7184, U+718A, U+7192, U+7194, U+7199, U+719F, U+71A8, U+71AC, U+71B1, U+71B9, U+71BE, U+71C3; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-15.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+71C4, U+71C8-71C9, U+71CE, U+71D0, U+71D2, U+71D5, U+71D9, U+71DC, U+71DF-71E0, U+71E5-71E7, U+71EC-71EE, U+71F4, U+71F8, U+71FB-71FC, U+71FE, U+7206, U+720D, U+7210, U+721B, U+7228, U+722A, U+722C-722D, U+7230, U+7235-7236, U+7238-723B, U+723D-723E, U+724C, U+7252, U+7256, U+7258-7259, U+725D, U+725F-7262, U+7267, U+726F, U+7272, U+7274, U+7279, U+727D, U+7280-7281, U+7284, U+7292, U+7296, U+729B, U+72A2, U+72A7, U+72AC, U+72AF, U+72C2, U+72C4, U+72CE, U+72D0, U+72D7, U+72D9, U+72E0-72E1, U+72E9, U+72F7-72F9, U+72FC-72FD, U+7313, U+7316, U+7319, U+731B-731C, U+7325, U+7329, U+7334, U+7336-7337, U+733E-733F, U+7344-7345, U+734E, U+7350, U+7357, U+7368, U+7370, U+7372, U+7375, U+7377-7378, U+737A-737B, U+7380, U+7384, U+7386-7387, U+7389, U+738B, U+7396, U+739F, U+73A5, U+73A8, U+73AB, U+73B2-73B3, U+73B7, U+73CA, U+73CD, U+73DE, U+73E0, U+73EA, U+73ED-73EE, U+7405, U+7409-740A, U+740D, U+741B, U+7422, U+7426, U+7428, U+742A, U+742F, U+7433-7436, U+743A, U+743F, U+7441, U+7455, U+7459-745C, U+745E-745F, U+7463-7464, U+7469-746A, U+746D, U+746F-7470, U+747E, U+7480, U+748B, U+7498, U+749C, U+749E-749F, U+74A3, U+74A6-74A7; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-16.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+74A8-74A9, U+74B0, U+74BD, U+74BF, U+74CA, U+74CF, U+74D4, U+74D6, U+74DA, U+74DC, U+74E0, U+74E2-74E4, U+74E6, U+74F6-74F7, U+7504, U+750C-750D, U+7515, U+7518, U+751A, U+751C, U+7525-7526, U+7529, U+752B-752D, U+7530, U+7532-7533, U+7537-7538, U+753D, U+754B, U+754E-754F, U+7554, U+755A, U+755C-755D, U+7562, U+7565-7566, U+756A, U+7578, U+757F, U+7586-7587, U+758A-758B, U+758F, U+7591, U+7599-759A, U+759D, U+75A2-75A5, U+75AB, U+75B2-75B3, U+75B5, U+75B8-75B9, U+75BC-75BE, U+75C2, U+75C5, U+75C7, U+75CA, U+75CD, U+75D4-75D5, U+75D8-75D9, U+75DB, U+75DE, U+75E0, U+75E2-75E3, U+75F0-75F4, U+75FA, U+75FF-7601, U+7609, U+760B, U+760D, U+7613, U+761F-7622, U+7624, U+7626-7627, U+7629, U+7634, U+7638, U+763A, U+7642, U+7646, U+764C, U+7652, U+7656, U+7658, U+765F, U+7661-7662, U+7665, U+7669, U+766C, U+766E, U+7671-7672, U+7678, U+7682, U+7686-7688, U+768B, U+768E, U+7693, U+7696, U+769A, U+76B0, U+76B4, U+76BA, U+76BF, U+76C2-76C3, U+76C5-76C6, U+76C8, U+76CA, U+76CD-76CE, U+76D2, U+76D4, U+76DB-76DC, U+76DE-76DF, U+76E1, U+76E3-76E5, U+76E7, U+76EE-76EF, U+76F2, U+76F9, U+76FC, U+76FE, U+7707, U+7709; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-17.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+7720, U+7728-7729, U+7736-7738, U+773A, U+773C, U+774F, U+775B-775C, U+775E, U+7761-7763, U+7765-7766, U+7768, U+776A-776C, U+7779, U+777D, U+777F, U+7784, U+7787, U+778B-778C, U+778E, U+7791, U+779E-77A0, U+77A5, U+77A7, U+77AA, U+77AC-77AD, U+77B0, U+77B3, U+77BB-77BD, U+77BF, U+77C7, U+77D3, U+77D7, U+77DA-77DC, U+77E2-77E3, U+77E9, U+77EE-77EF, U+77FD, U+7802, U+780C-780D, U+781D, U+781F-7820, U+7825, U+7827, U+782D, U+7830, U+7832, U+7834, U+7837-7838, U+7843, U+784E, U+785D, U+786B-786C, U+786F, U+787C, U+787F, U+7889, U+788C, U+7891, U+7893, U+7897-7898, U+78A3, U+78A7, U+78A9, U+78B3, U+78BA, U+78BE, U+78C1, U+78C5, U+78CA-78CB, U+78D0, U+78D5, U+78DA, U+78E7-78E8, U+78EC, U+78EF, U+78F4, U+78F7, U+78FA, U+7901, U+790E, U+7919, U+7926, U+792A-792C, U+793E, U+7940-7941, U+7946-7949, U+7950, U+7955-7957, U+795A, U+795D-7960, U+7965, U+7968, U+796D, U+797A, U+797F, U+7981, U+798D-798F, U+79A6-79A7, U+79AA, U+79B1, U+79B3, U+79B9-79BA, U+79BD-79C0, U+79C8-79C9, U+79CB, U+79D1-79D2, U+79D8, U+79DF, U+79E3-79E4, U+79E6-79E7, U+7A00, U+7A05, U+7A08, U+7A14, U+7A1A, U+7A1C, U+7A1E-7A1F; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-18.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+7A20, U+7A31, U+7A37, U+7A3B-7A3D, U+7A3F-7A40, U+7A46, U+7A4B-7A4E, U+7A57, U+7A60-7A62, U+7A69, U+7A6B, U+7A74, U+7A79, U+7A7F, U+7A81, U+7A84, U+7A88, U+7A92, U+7A95-7A98, U+7A9F-7AA0, U+7AA9-7AAA, U+7AAE-7AAF, U+7ABA, U+7ABF, U+7AC4-7AC5, U+7AC7, U+7ACA, U+7AD9, U+7ADF-7AE0, U+7AE3, U+7AE5, U+7AED, U+7AEF, U+7AF6, U+7AF9-7AFA, U+7AFD, U+7AFF, U+7B06, U+7B11, U+7B19, U+7B1B, U+7B1E, U+7B20, U+7B26, U+7B28, U+7B2E, U+7B4B, U+7B4D, U+7B4F-7B52, U+7B60, U+7B67, U+7B6E, U+7B75, U+7B77, U+7B84, U+7B87, U+7B8B, U+7B8F, U+7B94-7B95, U+7B9D, U+7BA0, U+7BAD, U+7BB1, U+7BB4, U+7BB8, U+7BC1, U+7BC4, U+7BC6, U+7BC9, U+7BCC, U+7BD9, U+7BDB, U+7BE0-7BE1, U+7BE4, U+7BE6, U+7BE9, U+7BF7, U+7BFE, U+7C07, U+7C0C-7C0D, U+7C11, U+7C1E, U+7C21, U+7C23, U+7C27, U+7C2A-7C2B, U+7C37-7C38, U+7C3D-7C40, U+7C43, U+7C4C-7C4D, U+7C50, U+7C5F-7C60, U+7C63-7C65, U+7C6C, U+7C6E, U+7C72, U+7C7D, U+7C89, U+7C92, U+7C95, U+7C97, U+7C9F, U+7CA5, U+7CB1, U+7CB3, U+7CB5, U+7CB9, U+7CBD-7CBE, U+7CCA, U+7CD5-7CD6, U+7CD9, U+7CDC-7CE0, U+7CE2, U+7CE7, U+7CEF-7CF0, U+7CF8, U+7CFB, U+7CFE, U+7D02, U+7D04, U+7D06-7D07, U+7D09-7D0A, U+7D0D, U+7D10, U+7D14; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-19.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+7D15, U+7D17, U+7D1B-7D1C, U+7D20-7D22, U+7D2E-7D2F, U+7D31-7D33, U+7D39, U+7D3C, U+7D40, U+7D42-7D44, U+7D46, U+7D55, U+7D5B, U+7D5E, U+7D61-7D62, U+7D68, U+7D6E, U+7D70-7D73, U+7D79, U+7D81, U+7D8F, U+7D91, U+7D9C, U+7D9E, U+7DA2, U+7DAC-7DAD, U+7DB0-7DB1, U+7DB4-7DB5, U+7DB8, U+7DBA-7DBB, U+7DBD-7DBF, U+7DC7, U+7DCA, U+7DD8-7DD9, U+7DDD-7DDE, U+7DE0, U+7DE3, U+7DE8-7DE9, U+7DEC, U+7DEF, U+7DF2, U+7DF4, U+7DF9, U+7DFB, U+7E08-7E0A, U+7E10-7E11, U+7E1B, U+7E1D-7E1E, U+7E23, U+7E2B, U+7E2E-7E2F, U+7E31-7E32, U+7E34-7E35, U+7E37, U+7E39, U+7E3D-7E3F, U+7E43, U+7E45-7E46, U+7E48, U+7E52, U+7E54-7E55, U+7E59-7E5A, U+7E61, U+7E69-7E6B, U+7E6D, U+7E73, U+7E79, U+7E7D, U+7E82, U+7E8F, U+7E93-7E94, U+7E96, U+7E9C, U+7F36, U+7F38, U+7F3A, U+7F3D, U+7F44, U+7F48, U+7F4C, U+7F50, U+7F54-7F55, U+7F5F, U+7F69-7F6A, U+7F70, U+7F72, U+7F75, U+7F77, U+7F79, U+7F85, U+7F88, U+7F8A-7F8C, U+7F8E, U+7F94, U+7F9A, U+7F9E, U+7FA4, U+7FA8, U+7FAF, U+7FB2, U+7FB6, U+7FB8-7FB9, U+7FBC-7FBD, U+7FBF, U+7FC1, U+7FC5, U+7FCC, U+7FCE, U+7FD2, U+7FD4-7FD5, U+7FDF-7FE1, U+7FE9, U+7FEE, U+7FF0-7FF1, U+7FF3, U+7FF9, U+7FFB-7FFC, U+8000-8001; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-20.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+8003-8004, U+8006, U+800B, U+800D, U+8010-8012, U+8015, U+8017-8019, U+801C, U+8026, U+8028, U+8033, U+8036, U+803D, U+803F, U+8046, U+804A, U+8052, U+8056, U+8058, U+805A, U+805E, U+806F-8073, U+8076-8077, U+807D-807F, U+8084-8087, U+8089, U+808B-808C, U+8093, U+8096, U+8098, U+809A-809B, U+809D, U+80A1-80A2, U+80A5, U+80A9-80AB, U+80AF, U+80B1-80B2, U+80B4, U+80BA, U+80C3-80C4, U+80CE, U+80D6, U+80DA-80DB, U+80DD-80DE, U+80E1, U+80E4-80E5, U+80ED, U+80EF-80F1, U+80F3-80F4, U+80F8, U+80FC, U+8102, U+8105-8106, U+8108, U+810A, U+8116, U+8123-8124, U+8129, U+812B, U+812F-8130, U+8139, U+813E, U+8146, U+814B-814C, U+814E, U+8150-8151, U+8153-8155, U+8165, U+816B, U+816E, U+8170-8171, U+8173-8174, U+8178-817A, U+817F-8180, U+8182, U+8188, U+818A, U+818F, U+8198, U+819A-819D, U+81A8-81A9, U+81B3, U+81BA, U+81BD-81C0, U+81C2-81C3, U+81C6, U+81C9, U+81CD, U+81CF, U+81D8, U+81DA, U+81DF, U+81E2-81E3, U+81E5, U+81E7-81E8, U+81EC-81ED, U+81F3-81F4, U+81FA-81FC, U+81FE, U+8200, U+8202, U+8205, U+8208-820A, U+820C-820D, U+8210, U+8212, U+8214, U+821B-821C; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-21.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+821E-821F, U+8222, U+8228, U+822A-822C, U+8235-8237, U+8239, U+8247, U+824B, U+8258-8259, U+8266, U+826E-826F, U+8271, U+8277, U+827E, U+828B, U+828D, U+8292, U+8299, U+829D, U+829F, U+82A3, U+82A5, U+82AC-82AD, U+82AF-82B1, U+82B3, U+82B7-82B9, U+82BB, U+82BD-82BE, U+82D1-82D4, U+82D7, U+82DB-82DC, U+82DE-82DF, U+82E3, U+82E5-82E7, U+82EF, U+8301-8306, U+8309, U+8317, U+8328, U+832B, U+8331-8332, U+8334-8336, U+8338-8339, U+8340, U+8343, U+8349-834A, U+834F-8350, U+8352, U+8354, U+8377-8378, U+837B-837C, U+8386, U+8389-838A, U+838E, U+8392-8393, U+8396, U+8398, U+839E, U+83A0, U+83A2, U+83A7, U+83AB, U+83BD, U+83C1, U+83C5, U+83CA, U+83CC, U+83D4, U+83DC, U+83DF-83E0, U+83E9, U+83EF-83F2, U+83F4, U+83F8, U+83FD, U+8403-8404, U+8407, U+840A-840E, U+842C, U+8431, U+8435, U+8438, U+843C-843D, U+8446, U+845B, U+8461, U+8463, U+8466, U+8469, U+846B-846D, U+8475, U+8477, U+8482, U+8499, U+849C, U+849E, U+84B2, U+84B8, U+84BC, U+84BF-84C0, U+84C4, U+84C6, U+84C9-84CA, U+84D1, U+84D3, U+84EC, U+84EE, U+84FF, U+8506, U+8511, U+8513-8514, U+8517, U+851A, U+8521, U+8523, U+8525; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-22.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+852C-852D, U+853D, U+8543, U+8548-854A, U+8559, U+855E, U+8568-856A, U+856D, U+857E, U+8584, U+8587, U+858A, U+8591, U+8594, U+859B-859C, U+85A6, U+85A8-85AA, U+85AF-85B0, U+85B9-85BA, U+85C9, U+85CF-85D0, U+85D5, U+85DD, U+85E4-85E5, U+85E9-85EA, U+85F7, U+85F9-85FB, U+8606-8607, U+860A-860B, U+8611, U+8617, U+861A, U+862D, U+8638, U+863F, U+864E, U+8650, U+8654-8655, U+865B-865C, U+865E, U+8667, U+866B, U+8671, U+8679-867B, U+868A, U+868C, U+8693, U+869C, U+86A3-86A4, U+86A9-86AA, U+86AF, U+86B1, U+86B5-86B6, U+86C0, U+86C4, U+86C6-86C7, U+86C9, U+86CB, U+86D0, U+86D4, U+86D9, U+86DB, U+86DE-86DF, U+86E4, U+86ED, U+86F9, U+86FB, U+86FE, U+8700, U+8702-8703, U+8706-8708, U+870A, U+8713, U+8718, U+871C, U+8722, U+8725, U+8729, U+8734, U+8737, U+873B, U+873F, U+874C, U+8753, U+8755, U+8757, U+8759, U+8760, U+8766, U+8768, U+8774, U+8776, U+8778, U+8782-8783, U+878D, U+879E-879F, U+87A2, U+87AB, U+87B3, U+87BA-87BB, U+87C0, U+87C6, U+87C8, U+87CB, U+87D1-87D2, U+87E0, U+87EC, U+87EF, U+87F2, U+87F9, U+87FB, U+87FE, U+8805, U+880D, U+8814-8815, U+881F, U+8821-8823, U+8831, U+8836, U+8839, U+883B, U+8840, U+884D, U+8853, U+8857, U+8859, U+885B, U+885D, U+8861-8862; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-23.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+8863, U+886B, U+8870, U+8877, U+8879, U+887D, U+8881-8882, U+8888, U+888D, U+8892, U+8896, U+889E, U+88B1, U+88C1, U+88CA, U+88D2, U+88D4-88D5, U+88D8-88D9, U+88DF, U+88E8, U+88EF, U+88F3-88F4, U+88F8-88F9, U+8902, U+890A, U+8910, U+8912-8913, U+8915, U+891A, U+8921, U+8925, U+892A-892B, U+8932, U+8936, U+8938, U+893B, U+893D, U+8944, U+8956, U+895E-8960, U+8964, U+896A, U+896C, U+896F, U+8972, U+8983, U+898B, U+898F, U+8993, U+8996, U+899C, U+89A6, U+89AA, U+89AC, U+89B2, U+89BD, U+89C0, U+89D4, U+89F4, U+89F8, U+89FC, U+8A03, U+8A0A, U+8A0C, U+8A0E-8A11, U+8A13, U+8A15-8A17, U+8A1B, U+8A1D, U+8A1F, U+8A22-8A23, U+8A25, U+8A2A, U+8A34, U+8A36, U+8A3A-8A3C, U+8A3E, U+8A41, U+8A46, U+8A50, U+8A54-8A56, U+8A5B, U+8A5E, U+8A60, U+8A62-8A63, U+8A68-8A69, U+8A6B-8A6E, U+8A70, U+8A72-8A73, U+8A79, U+8A7B-8A7C, U+8A85, U+8A87, U+8A8C-8A8D, U+8A91, U+8A93, U+8A95, U+8A98, U+8A9A, U+8AA1, U+8AA3, U+8AA5-8AA8, U+8AAA, U+8AB2, U+8AB6, U+8AB9, U+8ABC, U+8ABF, U+8AC2, U+8AC4, U+8AC7, U+8AC9, U+8ACD, U+8AD2, U+8AD6, U+8ADB-8ADC, U+8AE6-8AE7, U+8AEB, U+8AED-8AEE, U+8AF1, U+8AF3, U+8AF6-8AF8, U+8AFA, U+8AFC, U+8AFE, U+8B00-8B02, U+8B04, U+8B0A, U+8B0E; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-24.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+8B10, U+8B17, U+8B19, U+8B20, U+8B28, U+8B2B-8B2C, U+8B39, U+8B41, U+8B46, U+8B49, U+8B4E-8B4F, U+8B59-8B5A, U+8B5C, U+8B5F, U+8B66, U+8B6B-8B6C, U+8B6F-8B70, U+8B74, U+8B77, U+8B7D, U+8B92, U+8B96, U+8B9A, U+8B9C, U+8C37, U+8C3F, U+8C41, U+8C46, U+8C48-8C49, U+8C4C, U+8C4E, U+8C50, U+8C54-8C55, U+8C5A, U+8C61-8C62, U+8C6A-8C6D, U+8C73, U+8C79-8C7A, U+8C82, U+8C89-8C8A, U+8C8C-8C8D, U+8C93, U+8C9D-8C9E, U+8CA0-8CA2, U+8CA7-8CAC, U+8CAF, U+8CB2-8CB4, U+8CB6-8CB8, U+8CBB-8CBD, U+8CBF-8CC5, U+8CC8, U+8CCA, U+8CD1-8CD3, U+8CDC, U+8CDE, U+8CE0-8CE4, U+8CE6, U+8CEC-8CED, U+8CF4, U+8CF8, U+8CFA-8CFD, U+8D05, U+8D08, U+8D0A, U+8D0D, U+8D0F, U+8D13, U+8D16-8D17, U+8D1B, U+8D64, U+8D66-8D67, U+8D6B, U+8D73-8D74, U+8D81, U+8D8A, U+8D95, U+8D99, U+8D9F, U+8DA3, U+8DA8, U+8DB3-8DB4, U+8DBA, U+8DBE, U+8DC6, U+8DCB-8DCC, U+8DCE, U+8DD1, U+8DDA-8DDB, U+8DDD, U+8DE1, U+8DE4, U+8DE6, U+8DE8, U+8DEA, U+8DFA, U+8DFC, U+8E0F-8E10, U+8E1D-8E1F, U+8E21-8E22, U+8E29, U+8E2B, U+8E31, U+8E34-8E35, U+8E39, U+8E42, U+8E44, U+8E48-8E4B, U+8E55; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-25.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+8E59, U+8E5F, U+8E63, U+8E66, U+8E6C, U+8E72, U+8E74, U+8E76, U+8E7A, U+8E7C, U+8E81-8E82, U+8E85, U+8E87, U+8E89-8E8B, U+8E8D, U+8E91, U+8E93, U+8EA1, U+8EAA, U+8EAC, U+8EB2, U+8EBA, U+8EC0, U+8ECA-8ECD, U+8ECF, U+8ED2, U+8ED4, U+8EDB, U+8EDF, U+8EF8, U+8EFB-8EFC, U+8EFE, U+8F0A, U+8F12-8F14, U+8F1B-8F1F, U+8F25-8F26, U+8F29, U+8F2F, U+8F33, U+8F38, U+8F3B, U+8F3E-8F3F, U+8F42, U+8F44-8F45, U+8F4D-8F4E, U+8F54, U+8F5F, U+8F61, U+8F9B-8F9C, U+8F9F, U+8FA3, U+8FA6, U+8FAD-8FB2, U+8FC2, U+8FC4-8FC6, U+8FD1, U+8FD4, U+8FE2, U+8FE4-8FE6, U+8FE8, U+8FEA-8FEB, U+8FED, U+8FF0, U+8FF7-8FF8, U+8FFA, U+9003, U+9005-9006, U+900D, U+900F-9010, U+9015-9017, U+901B, U+901D-901F, U+9022, U+902E, U+9035-9036, U+9038, U+903E, U+9041-9042, U+9047, U+904A-904B, U+904D, U+904F-9051, U+9055, U+9058-9059, U+905B-905E, U+9062-9063, U+9068-9069, U+906D-906E, U+9072, U+9074-9075, U+9077, U+907A, U+907C-907D, U+907F-9083, U+9087-9088, U+908B, U+908F-9091, U+9095, U+90A2, U+90A6, U+90AA, U+90B1, U+90B5-90B6, U+90B8, U+90C1, U+90C3, U+90CA, U+90CE, U+90DD; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-26.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+90E1-90E2, U+90ED, U+90F5, U+90FE, U+9102, U+9109, U+9112, U+9117-9119, U+911E, U+9127, U+912D, U+9130-9131, U+9134, U+9139, U+9148-914C, U+9157, U+9163, U+9165, U+9169-916A, U+916C, U+9174-9175, U+9177-9178, U+9183, U+9187, U+9189, U+918B, U+919C, U+919E, U+91A3, U+91AB-91AC, U+91AE, U+91B1, U+91B4, U+91BA, U+91C0-91C1, U+91C5-91C7, U+91C9, U+91CB-91CC, U+91CE-91D1, U+91D7-91D9, U+91DC-91DD, U+91E3, U+91E6-91E7, U+91E9, U+91ED, U+91F5, U+9207, U+9209, U+920D, U+9210-9211, U+9214-9215, U+921E, U+9223, U+9234, U+9237-9239, U+923D-9240, U+9245, U+9249, U+924B, U+924D, U+9251, U+9257, U+925A-925B, U+9264, U+9278, U+927B-927C, U+9280, U+9285, U+9291, U+9293, U+9296, U+9298, U+929C, U+92A8, U+92AC, U+92B2-92B3, U+92B7, U+92BB-92BC, U+92C1, U+92C5, U+92C7, U+92D2, U+92E4, U+92EA, U+92F0, U+92F8, U+92FC, U+9310, U+9315, U+9318-931A, U+9320-9322, U+9326, U+9328, U+932B, U+932E, U+9333, U+9336, U+934A-934B, U+934D, U+9354, U+935A-935B, U+9365, U+936C, U+9370, U+9375, U+937E, U+9382, U+938A, U+9394, U+9397-9398, U+939A, U+93A2, U+93AC, U+93AE, U+93B0, U+93B3, U+93C3, U+93C8, U+93CD, U+93D1, U+93D6-93D8, U+93DC-93DD; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-27.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+93DF, U+93E1-93E2, U+93E4, U+93E8, U+93FD, U+9403, U+942B, U+942E, U+9432-9433, U+9435, U+9438, U+943A, U+9444, U+9451-9452, U+9460, U+9463-9464, U+946A, U+9470, U+9472, U+9477, U+947C-947F, U+9580, U+9582, U+9589, U+958E-958F, U+9591-9592, U+9594, U+9598, U+95A1, U+95A3-95A5, U+95A8-95A9, U+95AD, U+95B1, U+95BB, U+95C6, U+95C8, U+95CA-95CC, U+95D0, U+95D4-95D6, U+95E1-95E2, U+961C, U+9621, U+962A, U+962C, U+962E, U+9631-9632, U+963B, U+963F-9640, U+9642, U+964B-964D, U+9658, U+965B, U+965D-965E, U+9661-9662, U+966A, U+966C, U+9670, U+9672-9678, U+967D, U+9684-9686, U+968A-968B, U+968D-968E, U+9694-9695, U+9698-9699, U+969B-969C, U+96A7, U+96AA, U+96B4, U+96B8-96B9, U+96BB, U+96C0-96C1, U+96C4-96C5, U+96C7, U+96C9-96CD, U+96D2, U+96D5-96D6, U+96D9, U+96DB-96DC, U+96DE, U+96E8-96EA, U+96EF, U+96F6-96F7, U+96F9, U+96FB, U+9704, U+9706-9707, U+9709, U+970D-970F, U+9711, U+9713, U+9716, U+971C, U+971E, U+9724, U+972A, U+9730, U+9732, U+9738-9739, U+973D-973E, U+9742, U+9744, U+9756, U+975E, U+9760-9761, U+9766, U+9768, U+9774, U+9776, U+977C, U+9785, U+978B, U+978D; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-28.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+978F, U+9798, U+97A0, U+97A3, U+97A6, U+97AD, U+97C1, U+97C3, U+97C6, U+97C9, U+97CB-97CC, U+97D3, U+97DC, U+97ED, U+97F3, U+97F6, U+97F9, U+97FB, U+97FF, U+9802-9803, U+9805-9806, U+9808, U+980A, U+980C, U+9811-9813, U+9817-9818, U+981C, U+9821, U+9824, U+982B, U+9830, U+9837-9839, U+983B, U+984D-984E, U+9853, U+985B, U+985E, U+9865, U+9867, U+986B, U+986F-9871, U+98A8, U+98AF, U+98B1, U+98B3, U+98B6, U+98BA, U+98BC, U+98C4, U+98DB, U+98DF, U+98E2, U+98E7, U+98E9-98EA, U+98ED, U+98EF, U+98F2, U+98F4, U+98FC-98FE, U+9903, U+9905, U+9909-990A, U+990C, U+9910, U+9912-9913, U+9918, U+991A-991B, U+991E, U+9921, U+9928, U+992E, U+9935, U+993D-993F, U+9945, U+9949, U+9951-9952, U+9955, U+9957, U+995C, U+995E, U+9996, U+9999, U+99A5, U+99A8, U+99AC-99AE, U+99B1, U+99B3-99B4, U+99C1, U+99D0-99D2, U+99D5, U+99D9, U+99DB, U+99DD, U+99DF, U+99E2, U+99ED, U+99F1, U+99FF, U+9A01, U+9A0E, U+9A16, U+9A19, U+9A2B, U+9A30, U+9A35, U+9A37, U+9A3E, U+9A40, U+9A43, U+9A45, U+9A4D, U+9A55, U+9A5A-9A5B, U+9A5F, U+9A62, U+9A65, U+9A6A, U+9AA8, U+9AAF-9AB0, U+9AB7-9AB8, U+9ABC, U+9AC1, U+9ACF, U+9AD1-9AD3, U+9AD6, U+9AD8, U+9AE1, U+9AE6, U+9AED-9AEF, U+9AFB, U+9B03, U+9B0D, U+9B1A, U+9B22; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-29.woff2") format("woff2"); font-weight: 400; font-display: swap;
    unicode-range: U+9B23, U+9B25, U+9B27-9B28, U+9B31-9B32, U+9B3C, U+9B41-9B42, U+9B44-9B45, U+9B4D-9B4F, U+9B51, U+9B54, U+9B58, U+9B5A, U+9B6F, U+9B77, U+9B91, U+9BAA-9BAB, U+9BAD-9BAE, U+9BC0, U+9BC8-9BCA, U+9BD6, U+9BDB, U+9BE7-9BE8, U+9BFD, U+9C0D, U+9C13, U+9C25, U+9C2D, U+9C31, U+9C3B, U+9C3E, U+9C49, U+9C54, U+9C56-9C57, U+9C5F, U+9C77-9C78, U+9CE5, U+9CE9, U+9CF3-9CF4, U+9CF6, U+9D03, U+9D06, U+9D09, U+9D12, U+9D15, U+9D1B, U+9D23, U+9D26, U+9D28, U+9D3B, U+9D3F, U+9D51, U+9D5D, U+9D60-9D61, U+9D6A, U+9D6C, U+9D72, U+9D89, U+9DAF, U+9DB4, U+9DB8, U+9DC2, U+9DD3, U+9DD7, U+9DE5, U+9DF9-9DFA, U+9E1A-9E1B, U+9E1E, U+9E75, U+9E79, U+9E7C-9E7D, U+9E7F, U+9E82, U+9E8B, U+9E92-9E93, U+9E97, U+9E9D, U+9E9F, U+9EA5, U+9EA9, U+9EB4-9EB5, U+9EBB, U+9EBE, U+9EC3, U+9ECC-9ECF, U+9ED4, U+9ED8, U+9EDB-9EDD, U+9EE0, U+9EE8, U+9EEF, U+9EF4, U+9EF7, U+9F07, U+9F0E, U+9F13, U+9F15, U+9F19, U+9F20, U+9F2C, U+9F2F, U+9F34, U+9F3B, U+9F3E, U+9F4A-9F4B, U+9F52, U+9F5C, U+9F5F, U+9F61, U+9F63, U+9F66-9F67, U+9F6A, U+9F6C, U+9F72, U+9F77, U+9F8D, U+9F90, U+9F94, U+9F9C; }
  @font-face { font-family: "InkHand"; src: url("assets/fonts/inkhand-page.woff2") format("woff2"); font-weight: 400; font-display: swap; }
/* inkhand:end */

  /* Inkput commits to one visual world: paper stays bright, even in dark mode. */
  :root {
    --paper: #F7F1E3;
    --paper-deep: #EFE6D0;
    --taupe: #B9AC9B;        /* the app's writing-screen ground */
    --sheet-hi: #FDFAF2;
    --sheet-lo: #FAF4E6;
    --ink: #2B2620;
    --ink-soft: #6B6255;
    --teal: #2AB0B0;
    --teal-deep: #12716F;
    --gold: #E9C46A;
    --navy: #2F4396;         /* the app's default cover blue */
    --tape-ink: #8A6A4B;     /* the lettering on the session's masking tape */
    /* The app treats these as two separate journal hands, not a fallback stack:
       pick Playwrite and Latin is Playwrite; pick 辰宇落雁 and its own Latin
       glyphs come with it. Mixing them mid-sentence is a web artifact, so the
       order follows the page's language. */
    --hand: "Playwrite", "InkHand", cursive;
    --shadow: 43 38 32;
    --line: 34px;
  }

  * { box-sizing: border-box; }
  html { color-scheme: light; }
  body {
    margin: 0;
    overflow-x: clip;   /* guard the full-bleed strip's 100vw against scrollbar-width overflow */
    font: 400 17px/1.7 "Lora", Georgia, serif;
    color: var(--ink);
    background-color: var(--paper);
    background-image:
      radial-gradient(120vw 80vh at 18% 0%, #FBF6EB 0%, transparent 60%),
      radial-gradient(110vw 70vh at 92% 100%, var(--paper-deep) 0%, transparent 55%),
      url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="180" height="180"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="2"/><feColorMatrix type="matrix" values="0 0 0 0 0.55 0 0 0 0 0.50 0 0 0 0 0.42 0 0 0 0.05 0"/></filter><rect width="180" height="180" filter="url(%23n)"/></svg>');
    -webkit-font-smoothing: antialiased;
  }

  h1, h2, h3 { font-weight: 600; line-height: 1.18; margin: 0; text-wrap: balance; }
  p { margin: 0; }
  a { color: var(--teal-deep); text-decoration-color: rgb(42 176 176 / .45); text-underline-offset: 3px; }
  a:focus-visible, button:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; border-radius: 2px; }
  .notepad-input:focus, .notepad-input:focus-visible { outline: none; } /* the teal caret is the focus cue */

  .eyebrow {
    font: 600 .72rem/1 "Lora", serif;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--teal-deep);
    margin-bottom: 1.1rem;
  }

  main > section { max-width: 41rem; margin: 0 auto; padding: 5.2rem 1.4rem; }

  /* scroll reveals (craft.js adds .js to <html> first thing, then .in per element;
     no .js class (JS blocked/failed) => nothing is hidden; reduced-motion shows everything) */
  .reveal { transition: opacity .7s ease, transform .7s ease; }
  .js .reveal { opacity: 0; transform: translateY(16px); }
  .js .reveal.in { opacity: 1; transform: none; }
  @media (prefers-reduced-motion: reduce) { .js .reveal { opacity: 1; transform: none; } }

  /* ---------- header ---------- */
  .site-header { padding: 2.4rem 1.4rem 0; text-align: center; }
  .app-logo {
    display: block; width: 58px; height: 58px; margin: 0 auto .7rem;
    border-radius: 14px;
    box-shadow: 0 1px 2px rgb(var(--shadow) / .12), 0 6px 16px rgb(var(--shadow) / .16);
  }
  .wordmark { font: 600 1.35rem "Lora", serif; letter-spacing: .04em; }
  .wordmark::after { content: ""; display: block; width: 26px; height: 2px; margin: .55rem auto 0; background: var(--gold); border-radius: 2px; }
  .wordmark a { color: inherit; text-decoration: none; }

  /* Chinese sets denser than Latin: no italics, and the hand needs a little more
     room per line than Playwrite does. */
  :lang(zh-Hant) { font-style: normal; }
  /* one hand for both scripts, and the app's own size boost: CJK renders
     smaller than Latin at the same point size (InkputFontFamily.sizeBoost) */
  :lang(zh-Hant) { --hand: "InkHand", "Playwrite", cursive; }
  :lang(zh-Hant) #hero h1 .quiet { font-style: normal; }
  :lang(zh-Hant) #promise p { font-style: normal; }
  :lang(zh-Hant) .demo-hint { font-style: normal; }
  :lang(zh-Hant) .closing-line { font-style: normal; }   /* the card page, in Chinese */
  /* the hand draws small inside its em, so Chinese needs a size up to sit on the rule */
  :lang(zh-Hant) .notepad-input { font-size: 26px; }
  :lang(zh-Hant) .margin-note { font-size: 1.1rem; }
  :lang(zh-Hant) .session-page .hand { font-size: 1.2rem; }
  :lang(zh-Hant) .card-text { font-size: calc(min(384px, 82vw) * var(--ts, .058) * 1.16); }
  :lang(zh-Hant) .story-signoff { font-size: 1.45rem; }

  /* ---------- hero ---------- */
  #hero { text-align: center; padding-top: 2.6rem; max-width: 52rem; }
  #hero h1 { font-size: clamp(1.9rem, 4.6vw, 2.9rem); }
  #hero h1 .quiet { display: block; font-weight: 400; font-style: italic; color: var(--ink-soft); font-size: .62em; margin-top: .65rem; letter-spacing: .01em; }

  .hero-stage { position: relative; width: min(340px, 82vw); margin: 3.4rem auto 1.1rem; }
  .hero-stage::before {  /* the app's taupe writing ground, as a desk mat */
    content: ""; position: absolute; inset: -30px -34px -34px;
    background:
      radial-gradient(120% 100% at 30% 10%, rgb(255 255 255 / .10), transparent 55%),
      linear-gradient(160deg, #C1B4A3, var(--taupe) 55%, #AC9F8D);
    border-radius: 22px;
    box-shadow: inset 0 1px 3px rgb(255 255 255 / .35), inset 0 -14px 30px rgb(var(--shadow) / .12), 0 20px 50px rgb(var(--shadow) / .18);
  }
  .sheet-stack { position: relative; aspect-ratio: 1 / 1; }  /* Inkput sheets are square */
  .sheet {
    position: absolute; inset: 0;
    background: linear-gradient(var(--sheet-hi), var(--sheet-lo));
    border-radius: 14px;
    box-shadow: 0 2px 4px rgb(var(--shadow) / .12), 0 16px 40px rgb(var(--shadow) / .22);
  }
  .sheet.under { transform: translateY(5px) rotate(.5deg); filter: brightness(.985); }
  .sheet.top::before {  /* fixed ruling across the whole sheet — text writes on the lines, like the app */
    content: ""; position: absolute; inset: 0; border-radius: 14px;
    background: repeating-linear-gradient(transparent 0, transparent calc(var(--line) - 1px), rgb(107 98 85 / .22) calc(var(--line) - 1px), rgb(107 98 85 / .22) var(--line));
  }
  .notepad-input {
    position: absolute; inset: 0; z-index: 1;
    padding: 42px 22px 14px; border: 0; resize: none; overflow: hidden;
    background: transparent; color: var(--ink);
    font: 400 22px/var(--line) var(--hand);
    caret-color: var(--teal-deep);
  }
  .notepad-input::placeholder { color: var(--ink-soft); opacity: .55; }
  .corner-canvas {
    position: absolute; right: 0; bottom: 0; z-index: 2;
    width: 240px; height: 240px;   /* larger than the curl, so its shading isn't clipped */
    pointer-events: none; opacity: 0; transition: opacity .35s ease;
  }
  .corner-canvas.visible { pointer-events: auto; opacity: 1; cursor: pointer; clip-path: circle(115px at 100% 100%); }
  .peel-layer {
    position: absolute; inset: 0; z-index: 3; pointer-events: none;
    transition: transform .6s cubic-bezier(.3,.7,.2,1), opacity .6s ease;
  }
  .peel-layer.flying { transform: translate(45%, -130%) rotate(var(--tilt, 8deg)) scale(1.04); opacity: 0; }

  .desk-note {  /* the last peeled page rests on the desk, like in the app */
    position: absolute; left: -18px; bottom: -26px; z-index: 4;
    pointer-events: none;   /* decorative — must never block the curl */
    width: 72px; height: 72px; padding: 11px 8px 6px; overflow: hidden;
    background:
      repeating-linear-gradient(transparent 0 10px, rgb(107 98 85 / .18) 10px 11px),
      linear-gradient(var(--sheet-hi), var(--sheet-lo));
    border-radius: 7px;
    box-shadow: 0 4px 12px rgb(var(--shadow) / .3);
    font: 400 8px/11px var(--hand); color: var(--ink-soft); text-align: left;
    text-decoration: none; cursor: pointer;
    transform: rotate(var(--note-tilt, -7deg)) scale(.6); opacity: 0;
    transition: transform .45s cubic-bezier(.2,.9,.3,1.2), opacity .45s ease, box-shadow .25s ease;
  }
  .desk-note.show { transform: rotate(var(--note-tilt, -7deg)) scale(1); opacity: 1; pointer-events: auto; }
  .desk-note.show:hover, .desk-note.show:focus-visible {
    transform: rotate(var(--note-tilt, -7deg)) scale(1.06) translateY(-2px);
    box-shadow: 0 8px 20px rgb(var(--shadow) / .34);
  }

  .margin-note {
    position: absolute; width: 175px;
    font: 400 1rem/1.55 var(--hand);
    color: var(--ink-soft); text-align: left;
  }
  .margin-note svg { display: block; margin-top: .4rem; }
  .note-write { top: 24%; right: -215px; transform: rotate(3deg); }
  .note-write svg { transform: scaleX(-1) rotate(18deg); margin-left: 44px; }
  @media (max-width: 940px) { .margin-note { display: none; } }

  .hero-caption { font-size: .85rem; color: var(--ink-soft); max-width: 27rem; margin: 2.6rem auto 0; }
  .store-cta { margin-top: 2.3rem; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1rem 1.1rem; }
  /* Product Hunt's own badge, self-hosted: theirs is served from
     api.producthunt.com, and this page makes no third-party requests. */
  .ph-badge img { height: 54px; width: auto; }
  .store-link { display: inline-block; transition: transform .18s ease; }
  .store-link:hover { transform: translateY(-1px); }
  .store-link img { display: block; height: 54px; width: auto; }

  /* ---------- promise ---------- */
  #promise blockquote { margin: 0; border-left: 3px solid var(--gold); padding-left: 1.4rem; }
  #promise p { font-size: clamp(1.3rem, 3vw, 1.65rem); line-height: 1.5; font-style: italic; }

  /* ---------- protocols ---------- */
  .section-lede { color: var(--ink-soft); max-width: 34rem; }
  .protocol-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2.6rem 2.8rem; margin-top: 2.8rem; }
  @media (max-width: 640px) { .protocol-grid { grid-template-columns: 1fr; } }
  .protocol-grid h3 { font-size: 1.1rem; margin-bottom: .5rem; }
  .protocol-grid h3::after { content: ""; display: block; width: 34px; height: 2px; margin-top: .45rem; background: var(--teal); opacity: .55; border-radius: 2px; }
  .protocol-grid p { font-size: .95rem; color: var(--ink-soft); }
  .protocol-grid strong { color: var(--ink); font-weight: 600; }

  /* ---------- session ---------- */
  /* The writing screen as the app frames it: paper on the taupe ground, with the
     clock on a strip of masking tape (SessionTapeView) and its progress hairline. */
  .session-stage { margin-top: 2.9rem; }
  .screen {
    max-width: 27rem; margin: 0 auto; padding: .85rem .85rem 0;
    border-radius: 26px;
    background:
      radial-gradient(120% 100% at 30% 8%, rgb(255 255 255 / .12), transparent 55%),
      var(--taupe);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .25), 0 18px 40px rgb(var(--shadow) / .22);
  }
  .screen-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .1rem .35rem .5rem; }
  .pad-name { font: 600 .9rem "Lora", serif; color: #45403A; }

  .tape {
    display: inline-flex; align-items: center; gap: .28rem;
    padding: .3rem .6rem;
    font: 500 .82rem/1 ui-monospace, "SF Mono", Menlo, monospace;
    color: var(--tape-ink);
    background: rgb(242 230 191 / .9);   /* the app's tape, rgb(.95 .90 .75) */
    border: 0; cursor: pointer;
    transform: rotate(-1.5deg);
    /* torn edges: the same 8-segment zigzag TapeShape draws */
    clip-path: polygon(
      0 2px, 6.25% 0, 18.75% 2px, 31.25% 0, 43.75% 2px, 56.25% 0, 68.75% 2px, 81.25% 0, 93.75% 2px, 100% 2px,
      100% calc(100% - 2px), 93.75% 100%, 81.25% calc(100% - 2px), 68.75% 100%, 56.25% calc(100% - 2px),
      43.75% 100%, 31.25% calc(100% - 2px), 18.75% 100%, 6.25% calc(100% - 2px), 0 100%);
    transition: background .3s ease, color .3s ease;
  }
  .tape[data-state="done"] { background: rgb(242 217 140 / .95); color: #A9631B; }
  .tape svg { width: 10px; height: 10px; fill: currentColor; }
  .tape .glyph { display: none; }
  .tape[data-state="paused"] .glyph-pause, .tape[data-state="done"] .glyph-check { display: block; }

  .screen-progress { height: 2px; margin: 0 .35rem; background: rgb(255 255 255 / .22); border-radius: 2px; overflow: hidden; }
  .screen-progress span { display: block; height: 100%; width: 0; background: var(--teal); }
  .screen-progress[data-state="paused"] span { background: rgb(255 255 255 / .5); }

  .session-page {
    margin-top: .85rem; padding: 1.15rem 1.2rem 1.5rem;
    border-radius: 14px 14px 0 0;
    background:
      repeating-linear-gradient(transparent 0 33px, rgb(107 98 85 / .16) 33px 34px),
      linear-gradient(var(--sheet-hi), var(--sheet-lo));
    background-position: 0 6px, 0 0;
    box-shadow: 0 -1px 0 rgb(255 255 255 / .5), 0 6px 18px rgb(var(--shadow) / .16);
  }
  .session-page .prompt { font-size: .78rem; color: var(--teal-deep); padding-bottom: .5rem; margin-bottom: .35rem; }
  .session-page .hand { font: 400 1.02rem/34px var(--hand); }
  .session-page .hand > span { display: block; }   /* the lines, not the caret inside one */
  .caret {
    display: inline-block; width: 2px; height: 1.05em; background: var(--teal);
    vertical-align: -.18em; animation: blink 1.1s steps(2) infinite;
  }
  @keyframes blink { 50% { opacity: 0; } }
  @media (prefers-reduced-motion: reduce) { .caret { animation: none; } }

  .stage-controls { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; margin-top: 1.5rem; }
  .stage-controls .btn-solid, .stage-controls .btn-quiet { padding: .62rem 1.35rem; font-size: .9rem; }
  .demo-hint { text-align: center; font-size: .82rem; font-style: italic; color: var(--ink-soft); margin-top: .9rem; }

  .beats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.2rem; margin: 3.6rem 0 0; padding: 0; list-style: none; }
  @media (max-width: 700px) { .beats { grid-template-columns: 1fr; gap: 1.9rem; } }
  .beats h3 { font-size: 1.03rem; margin-bottom: .45rem; }
  .beats h3::after { content: ""; display: block; width: 30px; height: 2px; margin-top: .45rem; background: var(--teal); opacity: .55; border-radius: 2px; }
  .beats p { font-size: .93rem; color: var(--ink-soft); }

  /* the payoff: a session, closed */
  .summary {
    display: grid; grid-template-columns: 190px 1fr; align-items: center; gap: 2rem;
    margin: 4rem 0 0; padding: 1.8rem 1.9rem;
    border-radius: 20px;
    background: linear-gradient(var(--sheet-hi), var(--sheet-lo));
    box-shadow: 0 2px 4px rgb(var(--shadow) / .1), 0 16px 40px rgb(var(--shadow) / .18);
  }
  @media (max-width: 620px) { .summary { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 1.6rem; } }
  .summary h3 { font-size: 1.25rem; }
  .summary .meta { font-size: .82rem; color: var(--ink-soft); margin: .4rem 0 .9rem; letter-spacing: .01em; }
  .summary figcaption p:last-child { font-size: .93rem; color: var(--ink-soft); }

  .afters { display: grid; grid-template-columns: 1fr 1fr; gap: 2.4rem; margin-top: 3.4rem; }
  @media (max-width: 700px) { .afters { grid-template-columns: 1fr; gap: 2rem; } }
  .afters h3 { font-size: 1.03rem; margin-bottom: .5rem; }
  .afters p { font-size: .93rem; color: var(--ink-soft); }
  .weeks { display: flex; gap: .4rem; margin-top: .9rem; }
  .weeks span {
    font: 500 .74rem/1 ui-monospace, Menlo, monospace; color: var(--tape-ink);
    padding: .34rem .5rem; border-radius: 6px; background: rgb(242 230 191 / .75);
  }

  /* ---------- craft ---------- */
  #craft { max-width: 46rem; }
  .craft-item { display: grid; grid-template-columns: 260px 1fr; gap: 2.6rem; align-items: center; margin-top: 4.6rem; }
  .craft-item:nth-child(odd of .craft-item) { grid-template-columns: 1fr 260px; }
  .craft-item:nth-child(odd of .craft-item) .craft-demo { order: 2; }
  @media (max-width: 700px) {
    .craft-item, .craft-item:nth-child(odd of .craft-item) { grid-template-columns: 1fr; gap: 1.7rem; }
    .craft-item .craft-demo, .craft-item:nth-child(odd of .craft-item) .craft-demo { order: 0; justify-self: center; }
  }
  .craft-demo { justify-self: center; }
  .craft-copy h3 { font-size: 1.15rem; margin-bottom: .55rem; }
  .craft-copy p { font-size: .95rem; color: var(--ink-soft); }

  /* mini notebook — top-bound, like the app's covers */
  .mini-notebook { position: relative; width: 168px; height: 252px; margin: 0 auto 1.3rem; }
  .mini-sheet {
    position: absolute; left: 7px; top: 16px; width: 154px; height: 232px;
    border-radius: 10px;
    background-color: var(--sheet-hi);
    box-shadow: 0 3px 10px rgb(var(--shadow) / .16);
    transition: background .25s ease;
  }
  .mini-cover {
    position: absolute; left: 0; top: 0; width: 168px; height: 228px;
    border-radius: 12px;
    padding: 0 16px 16px;
    display: flex; flex-direction: column; justify-content: flex-end;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .18), inset 0 -10px 24px rgb(0 0 0 / .18), 0 10px 26px rgb(var(--shadow) / .3);
    transition: background-color .3s ease;
    background-image:
      repeating-linear-gradient(45deg, rgb(255 255 255 / .035) 0 1px, transparent 1px 4px),
      repeating-linear-gradient(-45deg, rgb(0 0 0 / .05) 0 1px, transparent 1px 4px),
      radial-gradient(130% 110% at 30% 12%, rgb(255 255 255 / .14), transparent 55%);
  }
  .mini-cover .binding {  /* horizontal grooves near the top: pages flip up */
    position: absolute; left: 0; right: 0; top: 14px; height: 22px;
    background: repeating-linear-gradient(to bottom, transparent 0 5px, rgb(0 0 0 / .16) 5px 6.5px, rgb(255 255 255 / .10) 6.5px 7.5px);
  }
  .mini-cover .cover-icon { width: 26px; height: 26px; margin-bottom: 8px; opacity: .95; }
  .mini-cover .cover-title { font: 600 .92rem/1.25 "Lora", serif; color: #fff; }
  .mini-cover .cover-sub { font: 400 .62rem/1.4 "Lora", serif; color: rgb(255 255 255 / .72); margin-top: 2px; }
  .mini-cover .cover-icon path { stroke: #fff; }

  [data-cover="sienna"]   .mini-cover { background-color: #A85A1F; }
  [data-cover="charcoal"] .mini-cover { background-color: #33322E; }
  [data-cover="navy"]     .mini-cover { background-color: var(--navy); }
  [data-cover="crimson"]  .mini-cover { background-color: #A32C35; }
  [data-cover="tan"]      .mini-cover { background-color: #E3C79B; }
  [data-cover="slate"]    .mini-cover { background-color: #64748F; }
  [data-cover="plum"]     .mini-cover { background-color: #4B2A66; }
  [data-cover="tan"] .mini-cover .cover-title { color: rgb(60 45 25 / .88); }
  [data-cover="tan"] .mini-cover .cover-sub { color: rgb(60 45 25 / .6); }
  [data-cover="tan"] .mini-cover .cover-icon path { stroke: rgb(60 45 25 / .8); }

  /* standalone sheet sample — the app's sheet-style picker as its own object */
  .sheet-sample {
    position: relative; width: 180px; height: 180px; margin: 0 auto 1.3rem;
    border-radius: 12px;
    background-color: var(--sheet-hi);
    box-shadow: 0 2px 4px rgb(var(--shadow) / .1), 0 12px 30px rgb(var(--shadow) / .18);
    transition: background .25s ease;
  }
  .sheet-sample .scribble {
    position: absolute; top: 20px; left: 14px; right: 12px;
    font: 400 14px/20px var(--hand); color: var(--ink-soft);
  }
  [data-sheet="plain"].sheet-sample  { background-image: linear-gradient(var(--sheet-hi), var(--sheet-lo)); }
  [data-sheet="stripe"].sheet-sample { background-image:
      repeating-linear-gradient(transparent 0 19px, rgb(107 98 85 / .22) 19px 20px),
      linear-gradient(var(--sheet-hi), var(--sheet-lo)); }
  [data-sheet="grid"].sheet-sample   { background-image:
      repeating-linear-gradient(transparent 0 19px, rgb(107 98 85 / .17) 19px 20px),
      repeating-linear-gradient(90deg, transparent 0 19px, rgb(107 98 85 / .17) 19px 20px),
      linear-gradient(var(--sheet-hi), var(--sheet-lo)); }
  [data-sheet="dotted"].sheet-sample { background-image:
      radial-gradient(rgb(107 98 85 / .33) 1.1px, transparent 1.4px),
      linear-gradient(var(--sheet-hi), var(--sheet-lo));
      background-size: 20px 20px, 100% 100%; }
  [data-sheet="watercolor"].sheet-sample { background-image:
      radial-gradient(60% 50% at 28% 26%, rgb(42 176 176 / .16), transparent 70%),
      radial-gradient(55% 45% at 72% 62%, rgb(233 196 106 / .22), transparent 70%),
      radial-gradient(45% 45% at 60% 20%, rgb(163 44 53 / .09), transparent 70%),
      linear-gradient(var(--sheet-hi), var(--sheet-lo)); }

  .swatch-rows { display: grid; gap: .8rem; justify-items: center; }
  .swatch-row { display: flex; align-items: center; gap: .42rem; justify-content: center; }
  .swatch {
    width: 24px; height: 24px; border-radius: 50%; border: 2px solid transparent; padding: 0; cursor: pointer;
    box-shadow: 0 2px 5px rgb(var(--shadow) / .25); transition: transform .15s ease;
  }
  .swatch:hover { transform: scale(1.14); }
  .swatch[aria-pressed="true"] { border-color: var(--ink); box-shadow: 0 0 0 2px var(--paper), 0 2px 5px rgb(var(--shadow) / .25); }
  .sw-sienna { background: #A85A1F; } .sw-charcoal { background: #33322E; }
  .sw-navy { background: var(--navy); } .sw-crimson { background: #A32C35; }
  .sw-tan { background: #E3C79B; } .sw-slate { background: #64748F; } .sw-plum { background: #4B2A66; }

  .thumb { background: none; border: 2px solid transparent; border-radius: 8px; padding: 2px 2px 1px; cursor: pointer; }
  .thumb[aria-pressed="true"] { border-color: var(--ink); }
  .thumb-paper {
    width: 30px; height: 30px; border-radius: 6px; margin: 0 auto;
    background-color: var(--sheet-hi);
    box-shadow: inset 0 0 0 1px rgb(var(--shadow) / .1), 0 1px 3px rgb(var(--shadow) / .15);
  }
  .thumb span { display: block; font: 400 .56rem/1 "Lora", serif; letter-spacing: .04em; color: var(--ink-soft); text-align: center; margin-top: 4px; }
  .tp-stripe { background-image: repeating-linear-gradient(transparent 0 7px, rgb(107 98 85 / .3) 7px 8px); }
  .tp-grid { background-image: repeating-linear-gradient(transparent 0 7px, rgb(107 98 85 / .25) 7px 8px), repeating-linear-gradient(90deg, transparent 0 7px, rgb(107 98 85 / .25) 7px 8px); }
  .tp-dotted { background-image: radial-gradient(rgb(107 98 85 / .45) 1px, transparent 1.3px); background-size: 7px 7px; }
  .tp-watercolor { background-image:
      radial-gradient(60% 50% at 30% 30%, rgb(42 176 176 / .25), transparent 70%),
      radial-gradient(50% 45% at 70% 65%, rgb(233 196 106 / .3), transparent 70%); }

  /* peel triptych */
  .triptych { display: flex; gap: 1.4rem; align-items: flex-end; }
  .beat { text-align: center; }
  .beat-sheet {
    position: relative; width: 84px; height: 84px; border-radius: 7px;
    background:
      repeating-linear-gradient(transparent 0 12px, rgb(107 98 85 / .2) 12px 13px),
      linear-gradient(var(--sheet-hi), var(--sheet-lo));
    box-shadow: 0 3px 9px rgb(var(--shadow) / .16);
  }
  .beat-sheet .scribble { position: absolute; top: 13px; left: 9px; right: 8px; font: 400 10px/13px var(--hand); color: var(--ink-soft); text-align: left; }
  .beat.curled .beat-sheet::after {
    content: ""; position: absolute; right: 0; bottom: 0; width: 24px; height: 24px;
    background: linear-gradient(315deg, transparent 49%, #FCF8EE 50%, #EBDFC3 100%);
    border-radius: 0 0 7px 0 ;
    filter: drop-shadow(-3px -3px 4px rgb(var(--shadow) / .28));
    animation: foldbreathe 4.5s ease-in-out infinite;
  }
  @keyframes foldbreathe { 50% { width: 27px; height: 27px; } }
  .beat.flying .beat-sheet { transform: rotate(9deg) translateY(-10px); box-shadow: 0 16px 26px rgb(var(--shadow) / .24); animation: floataway 5.5s ease-in-out infinite; }
  @keyframes floataway { 50% { transform: rotate(11deg) translateY(-16px); } }
  .beat-label { display: block; margin-top: .9rem; font: 400 1.15rem/1 var(--hand); color: var(--ink-soft); }

  /* 30-sheet stack — isometric notepad */
  .iso-scene { position: relative; width: 240px; height: 216px; margin: 0 auto; }
  .iso-pad {
    position: absolute; left: 50px; top: 52px; width: 140px; height: 140px;
    transform-style: preserve-3d;
    transform: rotateX(56deg) rotateZ(-42deg);
  }
  .iso-face { position: absolute; }
  .iso-shadow {
    width: 168px; height: 168px; left: -10px; top: -4px;
    transform: translateZ(-16px);
    background: rgb(70 58 40 / .32); border-radius: 16px; filter: blur(10px);
  }
  .iso-top {
    width: 140px; height: 140px; transform: translateZ(30px); border-radius: 10px;
    background:
      repeating-linear-gradient(transparent 0 17px, rgb(107 98 85 / .18) 17px 18px),
      linear-gradient(var(--sheet-hi), var(--sheet-lo));
  }
  .iso-layer {
    position: absolute; width: 140px; height: 140px; border-radius: 10px;
    background: #F2E9D4;
  }
  .iso-layer:nth-child(even) { background: #E3D7BA; }
  .iso-ghost {
    width: 140px; height: 140px; border-radius: 8px;
    border: 1.5px solid rgb(107 98 85 / .4);
  }
  .iso-ghost.g1 { transform: translateZ(88px) rotateZ(-6deg); opacity: .75; animation: isodrift 7s ease-in-out infinite; }
  @keyframes isodrift { 50% { transform: translateZ(98px) rotateZ(-7.5deg); } }
  .pad-count { display: block; margin-top: .4rem; text-align: center; font: 400 1.5rem/1 var(--hand); color: var(--ink-soft); transform: rotate(-3deg); }

  /* sphere: one canvas — ink layer drifts inside static glass */
  .sphere-wrap { position: relative; width: 190px; height: 190px; }
  .sphere-wrap::before {  /* contact shadow on the paper */
    content: ""; position: absolute; left: 14%; right: 14%; bottom: -7px; height: 22px;
    background: radial-gradient(50% 50% at 50% 50%, rgb(70 58 40 / .28), transparent 70%);
    border-radius: 50%;
  }
  .sphere-wrap canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
  .sphere-wrap { animation: breathe 6s ease-in-out infinite; }
  @keyframes breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.016); } }

  /* Tear demo — the sheet sits inert until the visitor picks it up, so it never
     swallows a scroll on a phone (the craft column is full-width under 700px). */
  .tear-stage { display: flex; flex-direction: column; align-items: center; gap: .8rem; }
  .tear-canvas { width: 260px; height: auto; aspect-ratio: 1; max-width: 100%; display: block; border-radius: 8px; cursor: crosshair; }
  /* touch-action stays bound strictly to armed — a mouse can always drag (see
     tear.js pointerdown), so the crosshair applies at rest, but `none` must
     never reach a mouse-only device, which is never armed. */
  .tear-stage[data-armed="true"] .tear-canvas { touch-action: none; }
  .tear-hint { margin: 0; min-height: 2.4em; font-size: .82rem; line-height: 1.4; color: var(--ink-soft); text-align: center; max-width: 24ch; }
  .tear-arm {
    font: 400 .9rem/1 "Lora", Georgia, serif; padding: .45rem 1rem; border-radius: 999px;
    border: 1px solid rgb(var(--shadow) / .28); background: rgb(255 255 255 / .55);
    color: var(--ink); cursor: pointer;
  }
  .tear-arm:hover { background: rgb(255 255 255 / .8); }
  .tear-arm:focus-visible { outline: 2px solid var(--teal-deep); outline-offset: 2px; }
  .tear-static { margin: 0; font-size: .82rem; color: var(--ink-soft); text-align: center; }
  /* With JS off the canvas never gets painted, so give it paper of its own and
     take away a button that cannot do anything. */
  html:not(.js) .tear-arm { display: none; }
  html:not(.js) .tear-canvas {
    background: linear-gradient(var(--sheet-hi), var(--sheet-lo));
    box-shadow: 0 2px 8px rgb(var(--shadow) / .18);
  }

  /* ---------- in the app (screenshots) ---------- */
  .screen-strip {
    display: flex; gap: 1.1rem; margin-top: 2.4rem;
    /* full-bleed: escape the text measure and run edge to edge */
    width: 100vw; margin-left: calc(50% - 50vw);
    padding: 1.5rem calc(50vw - 50%) 3rem;   /* room for the card shadows */
    overflow-x: auto; scroll-snap-type: x proximity;
    scrollbar-color: var(--paper-deep) transparent;
  }
  .screen-strip::-webkit-scrollbar { height: 8px; }
  .screen-strip::-webkit-scrollbar-thumb { background: var(--paper-deep); border-radius: 4px; }
  .screen-strip::-webkit-scrollbar-track { background: transparent; }
  .screen-strip img {
    flex: none; height: 400px; width: auto;
    border-radius: 16px; scroll-snap-align: center;
    box-shadow: 0 3px 8px rgb(var(--shadow) / .12), 0 16px 36px rgb(var(--shadow) / .16);
  }
  @media (max-width: 640px) { .screen-strip img { height: 330px; } }

  /* ---------- privacy ---------- */
  #privacy { position: relative; }
  #privacy .body { max-width: 34rem; margin-top: .9rem; }
  .note-privacy { top: 46%; right: -130px; transform: rotate(-4deg); width: 120px; }

  /* ---------- story ---------- */
  #story { max-width: 46rem; }
  .story-sheet {
    position: relative; margin-top: 2.4rem;
    background:
      linear-gradient(315deg, transparent 31px, var(--sheet-hi) 31px),
      linear-gradient(180deg, var(--sheet-hi), var(--sheet-lo));
    border-radius: 12px;
    padding: clamp(1.8rem, 5vw, 3.4rem);
    box-shadow: 0 3px 6px rgb(var(--shadow) / .08), 0 22px 54px rgb(var(--shadow) / .16);
  }
  .story-sheet::after {
    content: ""; position: absolute; right: 0; bottom: 0; width: 44px; height: 44px;
    background: linear-gradient(315deg, transparent 49%, #FCF8EE 50%, #EBDFC3 100%);
    border-radius: 0 0 12px 0;
    filter: drop-shadow(-4px -4px 5px rgb(var(--shadow) / .22));
  }
  .story-sheet p { margin: 1.15rem 0; font-size: .98rem; }
  .story-sheet p:first-child { margin-top: 0; }
  .story-signoff { font: 400 1.7rem/1.3 var(--hand); color: var(--ink); margin-top: 1.8rem; }
  .story-signoff a { font: 400 .8rem "Lora", serif; color: var(--teal-deep); margin-left: .6rem; }

  /* ---------- legal pages (privacy.html / terms.html) ---------- */
  .legal h1 { margin-bottom: 1rem; }
  .legal h2 { margin: 2rem 0 .6rem; }
  .legal p { margin: 1rem 0; }
  .legal ul { margin: 1rem 0; padding-left: 1.4rem; }
  .legal li { margin: .3rem 0; }

  /* ---------- changelog ---------- */
  /* Generated by scripts/build-changelog.py; the version sits in the margin
     like .margin-note, but unlike those it must never be hidden — it is the
     entry's identity. Under 700px it moves above its notes instead. */
  .changelog { list-style: none; margin: 2.6rem 0 0; padding: 0; }
  .release { display: grid; grid-template-columns: 8.5rem 1fr; gap: 0 1.8rem; margin: 0 0 2.3rem; }
  .release-id { text-align: right; padding-top: .1rem; }
  .release-version { display: block; font-weight: 600; letter-spacing: .01em; }
  .release-id time { display: block; margin-top: .1rem; font-size: .8rem; color: var(--ink-soft); }
  .changelog .release-notes { list-style: none; margin: 1rem 0; padding-left: 1.4rem; }
  .release-notes li { position: relative; margin: .3rem 0; padding-left: 1rem; font-size: .95rem; line-height: 1.6; color: var(--ink-soft); }
  .release-notes li::before { content: "·"; position: absolute; left: .2rem; color: var(--taupe); }
  @media (max-width: 700px) {
    .release { grid-template-columns: 1fr; gap: .3rem; margin-bottom: 2rem; }
    .release-id { display: flex; align-items: baseline; gap: .6rem; text-align: left; }
    .release-id time { margin-top: 0; }
  }

  /* ---------- download & footer ---------- */
  #download { text-align: center; }
  .closing-line { font-size: 1.35rem; font-style: italic; }
  .site-footer { border-top: 1px solid rgb(var(--shadow) / .12); margin-top: 2.5rem; padding: 2.2rem 1.4rem 3.2rem; text-align: center; font-size: .84rem; color: var(--ink-soft); }
  .site-footer nav { margin-bottom: .5rem; }
  .site-footer nav a { margin: 0 .65rem; }
  /* the app's own heart, from the notebook cover — the page has no emoji */
  .site-footer .heart { width: .82em; height: .82em; vertical-align: -.09em; fill: var(--gold); }

  @media (prefers-reduced-motion: reduce) {
    * { transition: none !important; animation: none !important; }
  }

  /* ---------- shared card page (/s) ---------- */
  .card-page main > section { max-width: 34rem; padding-top: 2rem; text-align: center; }
  .card-page .site-header a.home-link { display: inline-block; color: inherit; text-decoration: none; }
  .card-page .wordmark { display: block; }

  /* the notebook behind overhangs the square sheet (-15% top, -23% bottom),
     so the stage reserves that space instead of letting it collide. */
  .card-stage {
    position: relative; width: min(384px, 82vw);
    margin: calc(min(384px, 82vw) * .14 + 1rem) auto calc(min(384px, 82vw) * .1 + 1.5rem);
  }
  .card-behind {  /* an Inkput notebook: portrait cover under a square sheet, as in the app */
    position: absolute; left: 6%; right: 16%; top: -9%; bottom: 3%;
    border-radius: calc(min(384px, 82vw) * .06);
    background-color: var(--navy);
    background-image:
      repeating-linear-gradient(45deg, rgb(255 255 255 / .035) 0 1px, transparent 1px 5px),
      repeating-linear-gradient(-45deg, rgb(0 0 0 / .05) 0 1px, transparent 1px 5px),
      radial-gradient(130% 110% at 28% 10%, rgb(255 255 255 / .16), transparent 58%);
    transform: rotate(-6deg) translate(-7%, 3%);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / .18), inset 0 -14px 30px rgb(0 0 0 / .18),
                0 14px 34px rgb(var(--shadow) / .28);
  }
  .behind-binding {  /* grooves along the top: pages flip up */
    position: absolute; left: 0; right: 0; top: 3.5%; height: 4%;
    background: repeating-linear-gradient(to bottom,
      transparent 0 30%, rgb(0 0 0 / .22) 30% 44%, rgb(255 255 255 / .10) 44% 56%);
  }
  .paper-card {
    position: relative; margin: 0;
    aspect-ratio: 1 / 1;
    display: flex; flex-direction: column;
    padding: 8.8%;
    background: linear-gradient(#FDFAF2, #F7F2E4);
    border-radius: 5.8%;
    box-shadow: 0 4px 10px rgb(var(--shadow) / .12), 0 30px 60px rgb(var(--shadow) / .30);
    transform: rotate(2deg);
    overflow: hidden;
  }
  .card-quote {
    font: 700 3.1rem/1 "Lora", Georgia, serif;
    color: rgb(107 98 85 / .32);
    text-align: left; height: .8em;
  }
  .card-text {
    flex: 1; min-height: 0; overflow: hidden;
    margin: .5rem -8.8% 0; padding: 0 8.8%;
    font: 400 calc(min(384px, 82vw) * var(--ts, .058))/1.52 var(--hand);
    color: var(--ink); text-align: left; white-space: pre-wrap;
    /* one rule per line box, so the handwriting sits on the lines */
    background-image: repeating-linear-gradient(
      transparent 0 calc(1.52em - 1px),
      rgb(107 98 85 / .17) calc(1.52em - 1px) 1.52em);
  }
  .card-foot {
    display: flex; align-items: center; gap: .55rem;
    font: 400 .78rem/1 "Lora", Georgia, serif; color: rgb(107 98 85 / .9);
  }
  .card-foot img { width: 22px; height: 22px; border-radius: 6px; }

  .card-actions { display: flex; flex-direction: column; align-items: center; gap: 1rem; margin-top: 2.5rem; }
  .btn-solid.btn-icon { padding: 1rem; border-radius: 50%; line-height: 0; }
  .btn-icon svg { width: 1.35em; height: 1.35em; }
  .btn-icon .icon-done, .btn-icon.done .icon-dl { display: none; }
  .btn-icon.done .icon-done { display: block; }
  .sr-only {
    position: absolute; width: 1px; height: 1px; margin: -1px;
    padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
  }
  .btn-solid, .btn-quiet, .home-btn {
    display: inline-flex; align-items: center; gap: .55rem;
    font: 600 .95rem "Lora", Georgia, serif; letter-spacing: .01em;
    padding: .8rem 1.6rem; border-radius: 999px; cursor: pointer;
    border: 1px solid transparent; text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  }
  /* an author `display` beats the UA's [hidden], so say it again here */
  .btn-solid[hidden], .btn-quiet[hidden], .home-btn[hidden] { display: none; }
  .btn-solid svg, .btn-quiet svg, .home-btn svg {
    width: 1.15em; height: 1.15em; flex: none;
    fill: none; stroke: currentColor; stroke-width: 1.6;
    stroke-linecap: round; stroke-linejoin: round;
  }
  .home-btn svg { fill: currentColor; stroke: none; }
  .btn-solid, .home-btn {
    background: var(--ink); color: var(--paper);
    box-shadow: 0 6px 18px rgb(var(--shadow) / .24);
  }
  .btn-solid:hover, .home-btn:hover { transform: translateY(-1px); }
  .btn-solid[disabled] { opacity: .65; cursor: default; transform: none; }
  .btn-quiet { background: transparent; color: var(--ink-soft); border-color: rgb(var(--shadow) / .22); }
  .btn-quiet:hover { background: rgb(var(--shadow) / .05); }

  .card-note { margin-top: 1.6rem; font-size: .82rem; color: var(--ink-soft); }
  .card-cta {
    margin-top: 6rem; padding-top: 4rem;
    border-top: 1px solid rgb(var(--shadow) / .12);
  }
  .card-cta .closing-line { line-height: 1.35; margin-bottom: 2.4rem; }
  /* two separate invitations: try it here, or get the app */
  .cta-row { display: flex; flex-direction: column; gap: 2.2rem; align-items: center; }
  .empty-title { font-size: clamp(1.4rem, 4vw, 1.9rem); margin-bottom: 1rem; }
  #empty .section-lede { margin: 0 auto; }
  #empty .store-cta { margin-top: 2rem; }

  /* ---------- support ---------- */
  .support-contact { margin: 1.6rem 0; }
  .support-contact .home-btn { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .9rem; }
