@font-face { font-family: "Klee One Study"; src: url("/study/fonts/klee-study-base.729758951e.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+2E8C-2E8D, U+2ECF, U+2ED6, U+3005, U+3041-3096, U+30A1-30FE, U+4E00-4E01, U+4E03, U+4E07, U+4E09-4E0B, U+4E0D, U+4E16, U+4E19, U+4E21, U+4E28, U+4E2C-4E2D, U+4E36-4E37, U+4E3B, U+4E3F, U+4E42-4E43, U+4E4D, U+4E57, U+4E59, U+4E5D-4E5F, U+4E85, U+4E88, U+4E8B-4E8C, U+4E91, U+4E94-4E95, U+4E9C, U+4EA0-4EA1, U+4EA4, U+4EAC, U+4EBA-4EBB, U+4ECA-4ECB, U+4ED5, U+4EE3, U+4EE5, U+4F11, U+4F1A, U+4F4E-4F4F, U+4F53, U+4F55, U+4F5C, U+4F7F, U+4F9B, U+4FBF, U+501F, U+50CD, U+513F, U+5143-5144, U+5148-5149, U+514D, U+5165, U+5168, U+516B-516D, U+5182, U+5185-5186, U+518A, U+5196, U+5199, U+51AB-51AC, U+51E0, U+51F5, U+51FA, U+5200, U+5202, U+5206-5207, U+5225, U+5229, U+5236, U+524D, U+529B, U+52AA, U+52C9, U+52D5, U+52F9, U+52FF, U+5315-5317, U+531A, U+533A-533B, U+5341, U+5343, U+5348, U+534A, U+5357, U+535C, U+5360, U+5369, U+5382, U+53B6, U+53BB, U+53C8, U+53CB, U+53CD, U+53E3-53E4, U+53EF-53F0, U+53F3, U+5408, U+540C-540D, U+540F, U+5468, U+5473, U+54C1, U+54E1, U+554F, U+56D7, U+56DB, U+56DE, U+56F3, U+56FD, U+571F, U+5730, U+5802, U+5834, U+58EB, U+58F0, U+58F2, U+5902, U+590F, U+5915-5916, U+591A, U+591C, U+5927, U+5929-592A, U+592E, U+5944, U+5973, U+597D, U+59B9, U+59C9, U+59CB, U+5B50, U+5B57, U+5B5D, U+5B66, U+5B80, U+5B89, U+5B8C, U+5B98, U+5BA4, U+5BB6, U+5BD2, U+5BF8, U+5C02, U+5C0E-5C0F, U+5C11, U+5C1A, U+5C22, U+5C24, U+5C38, U+5C3A, U+5C40, U+5C4B, U+5C6E-5C6F, U+5C71, U+5DDB, U+5DDD, U+5DE5-5DE6, U+5DF1-5DF2, U+5DF4, U+5DFE, U+5E02, U+5E30, U+5E72, U+5E74, U+5E7A, U+5E7F, U+5E81, U+5E83, U+5E97, U+5EA6, U+5EF4, U+5EFA, U+5EFE-5EFF, U+5F0B, U+5F0F, U+5F13, U+5F15, U+5F1F, U+5F31, U+5F37, U+5F50-5F51, U+5F61, U+5F66, U+5F73, U+5F85, U+5F8C, U+5FC3-5FC4, U+601D, U+6025, U+60AA, U+610F, U+6208, U+6238, U+6240, U+624B-624C, U+6301, U+6535, U+6559, U+6587, U+6589, U+6597, U+6599, U+65A4, U+65B0, U+65B9, U+65C5, U+65CF, U+65E5-65E6, U+65E9, U+660E, U+6614, U+661C, U+6620, U+6625, U+662F, U+663C, U+6642, U+6691, U+6697, U+66DC, U+66F0, U+66F4, U+66F8, U+6708-6709, U+670D, U+671D, U+6728, U+672A, U+672C, U+6751, U+6765, U+6771, U+6797, U+6821, U+68EE, U+690D, U+696D, U+697D, U+6B20, U+6B4C, U+6B62-6B63, U+6B69, U+6B79, U+6B7B, U+6BB3, U+6BCB, U+6BCD-6BCE, U+6BDB, U+6C0F, U+6C11, U+6C14, U+6C17, U+6C34-6C35, U+6C60, U+6CE8, U+6D0B, U+6D17, U+6D77, U+6F22, U+6F2B, U+706B-706C, U+7121, U+713C, U+722A, U+7236, U+723B, U+723F, U+7247, U+725B, U+7269, U+7279, U+72AC-72AD, U+7389, U+738B, U+7406, U+74DC, U+751F, U+7523, U+7528, U+752C, U+7530, U+7537, U+753A-753B, U+754C, U+758B, U+7592, U+75C5, U+7676, U+767A-767B, U+767D-767E, U+76EE, U+76F2, U+770C, U+771F, U+7740, U+77DB, U+77E2, U+77E5, U+77ED, U+77F3, U+7814, U+793B, U+793E, U+79B8, U+79BE, U+79C1, U+79CB, U+7A74, U+7A76, U+7A7A, U+7ACB, U+7AF9, U+7B11, U+7B54, U+7C73, U+7CF8, U+7D19, U+7D42, U+7F52, U+7F8A, U+7FBD, U+7FD2, U+8001-8003, U+8005, U+800C, U+8012, U+8033, U+805E, U+807F, U+8089, U+81EA, U+81F3, U+820C, U+821B, U+826E-826F, U+8272, U+8279, U+82B1, U+82F1, U+8336, U+83DC, U+842C, U+85AC, U+864D, U+866B, U+884C, U+8863-8864, U+8881, U+897F, U+898B, U+89AA, U+8A00, U+8A08, U+8A66, U+8A71, U+8A9E, U+8AAC-8AAD, U+8C46, U+8C55, U+8C78, U+8C9D, U+8CA8, U+8CB7-8CB8, U+8CEA, U+8D64, U+8D70, U+8D77, U+8DB3, U+8EAB, U+8ECA, U+8EE2, U+8EFD, U+8F9B, U+8FB0, U+8FB2, U+8FB6, U+8FD1, U+9001, U+901A, U+9031-9032, U+904B, U+9053, U+9060, U+90E8, U+90FD, U+9149, U+91C6-91C7, U+91CC-91CE, U+91D1, U+9280, U+9577, U+9580, U+958B, U+9593, U+964D, U+9662, U+969B, U+96B6, U+96B9, U+96C6, U+96E8, U+96FB, U+9752, U+975E, U+9762, U+97CB, U+97F3, U+9801, U+982D, U+984C, U+9854, U+98A8, U+98DF-98E0, U+98EF, U+98F2, U+9928, U+9996, U+99AC, U+99C5, U+9A13, U+9AD8, U+9ADF, U+9B2F, U+9B32, U+9B3C, U+9B5A, U+9CE5, U+9EC4, U+9ED2, U+201A2; }
@font-face { font-family: "Klee One Study"; src: url("/study/fonts/klee-study-n3.22eab36089.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+4E08, U+4E0E, U+4E26, U+4E32, U+4E38, U+4E3C, U+4E45, U+4E89, U+4E92, U+4ED6, U+4ED8, U+4EF6, U+4EFB, U+4F1D, U+4F3C, U+4F4D, U+4F59, U+4F8B, U+4FA1, U+4FC2, U+4FE1, U+4FFA, U+500B, U+500D, U+5012, U+5019, U+5024, U+5049, U+5074, U+5076, U+5099, U+512A, U+5171, U+5177, U+518D, U+51B7, U+51E6, U+5217, U+521D, U+5224, U+5230, U+523A-523B, U+5272, U+52A0, U+52A9, U+52B4, U+52B9, U+52D9, U+52DD, U+52E4, U+5302, U+5305, U+5352, U+5358, U+5370-5371, U+5375, U+539A, U+539F, U+53C2, U+53CA, U+53CE, U+53D6-53D7, U+53F7-53F8, U+5411, U+541B, U+5426, U+5438-5439, U+544A, U+547C-547D, U+548C, U+5546, U+5584, U+5589, U+559C, U+55C5, U+5668, U+56E0, U+56F0, U+5712, U+5728, U+5742, U+5747, U+578B, U+57CE, U+57DF, U+57FA, U+5831, U+5869, U+5897, U+5909, U+5922, U+592B, U+5931, U+5965, U+59BB, U+5A18, U+5A5A, U+5A66, U+5B58, U+5B63, U+5B85, U+5B88, U+5B9A, U+5B9D, U+5B9F, U+5BA2, U+5BB3, U+5BB9, U+5BBF, U+5BC4, U+5BCC, U+5BDD, U+5BDF, U+5BFA, U+5BFE-5BFF, U+5C3B, U+5C3E, U+5C45, U+5C48, U+5C4A, U+5CF6, U+5DEE, U+5E03, U+5E0C, U+5E2B, U+5E2D, U+5E38, U+5E73, U+5E78, U+5E7E, U+5EA7, U+5EAB, U+5EAD, U+5F35, U+5F53, U+5F62, U+5F79, U+5F7C, U+5F92, U+5F97, U+5FA1, U+5FC5, U+5FD8-5FD9, U+5FF5, U+6012, U+6016, U+6027, U+6050, U+6065, U+606F, U+60B2, U+60C5, U+60F3, U+611B, U+611F, U+614C, U+6163, U+61F8, U+6210, U+621A, U+6226, U+623B, U+624D, U+6253, U+6255, U+6280, U+6295, U+6298, U+629C, U+62B1, U+62BC, U+62D2, U+62DB, U+62ED, U+62F6, U+6307, U+6328, U+6355, U+6368, U+6383, U+6388, U+639B, U+63A2, U+63A5, U+63DB, U+63E1, U+652F, U+653E-653F, U+6557, U+6563, U+6570, U+6574, U+65AD, U+6613, U+661F, U+6628, U+6669, U+666E-666F, U+6674, U+6696, U+66AE, U+66F2, U+66FF-6700, U+671B, U+671F, U+672B, U+672D, U+673A, U+6750, U+675F, U+676F, U+677E, U+6795, U+679C, U+67FB, U+67FF, U+6839, U+683C, U+6848, U+6905, U+6975, U+69CB, U+69D8, U+6A29-6A2A, U+6A5F, U+6B21, U+6B32, U+6B6F, U+6B73, U+6B8B, U+6BB5, U+6BBA, U+6BD4, U+6C37, U+6C42, U+6C57, U+6C5A, U+6C7A, U+6CB9, U+6CBB, U+6CCA, U+6CD5, U+6CE2-6CE3, U+6CF3, U+6D25, U+6D3B, U+6D41, U+6D45, U+6D6E, U+6D74, U+6D88, U+6D99, U+6DF1, U+6DF7, U+6E08, U+6E1B, U+6E21, U+6E29, U+6E2F, U+6E80, U+6E96, U+6EF4, U+6F01, U+6F14, U+70B9, U+7126, U+7136, U+7159, U+71B1, U+71C3, U+72AF, U+72B6, U+72EC, U+732B, U+7387, U+73FE, U+7403, U+7518, U+7531, U+7533, U+7551, U+7559, U+756A, U+7570, U+7591, U+75B2, U+75DB, U+75E9, U+7684, U+7686, U+76AE, U+76BF, U+76D7, U+76E4, U+76F4, U+76F8, U+7720, U+7834, U+78BA, U+793A, U+793C, U+7956, U+795E, U+796D, U+7981, U+798F, U+79D1-79D2, U+79FB, U+7A0B, U+7A2E, U+7A4D, U+7A81, U+7A93, U+7AF6, U+7B49, U+7B97, U+7BB1, U+7BB8, U+7BC0, U+7C21, U+7CBE, U+7D04-7D05, U+7D30, U+7D44, U+7D4C, U+7D50, U+7D61, U+7D66, U+7D75-7D76, U+7D9A, U+7DD1-7DD2, U+7DDA, U+7DF4, U+7F6A, U+7F6E, U+7F72, U+7F8E, U+7FA8, U+8077, U+8098, U+80B2, U+80CC, U+80FD, U+8179, U+819D, U+821E-821F, U+8239, U+82E5-82E6, U+8349, U+8377, U+843D, U+8449, U+84CB, U+8584, U+8702, U+871C, U+8853, U+8857, U+885B, U+8868, U+8896, U+88CF, U+8981, U+898F, U+899A, U+89B3, U+89D2, U+89E3, U+8A18, U+8A2A, U+8A31, U+8A55, U+8A8C-8A8D, U+8AA4, U+8AB0, U+8ABF, U+8AC7, U+8AD6, U+8AE6, U+8AF8, U+8B0E, U+8B1B, U+8B1D, U+8B58, U+8B66, U+8B70, U+8C37, U+8CA0-8CA1, U+8CA7, U+8CAC, U+8CBB-8CBC, U+8CC7, U+8CDB, U+8D8A, U+8DEF, U+8E74, U+8F9E, U+8FBA, U+8FBC, U+8FCE, U+8FD4, U+8FF0, U+8FF7, U+8FFD, U+9000, U+9003, U+9006, U+9014, U+901F, U+9023, U+9045, U+904A, U+904E, U+9054-9055, U+9069, U+9078, U+90F5, U+90F7, U+914D, U+9152, U+91CF, U+9244, U+934B, U+9375, U+9589, U+95A2, U+95C7, U+9632, U+9650, U+9664, U+967A, U+967D, U+968E, U+969C, U+96D1, U+96E3, U+96EA, U+96F2, U+9707, U+9759, U+9769, U+9774, U+9802-9803, U+9806, U+9810, U+9830, U+983C, U+984D, U+9858, U+985E, U+98DB, U+9905, U+9AA8, U+9AEA, U+9CF4, U+9EA6, U+9EBA, U+9F62, U+20B9F; }
@font-face { font-family: "Klee One Study"; src: url("/study/fonts/klee-study-n2.5f15363710.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+4E71, U+4E73, U+4E7E, U+4E86, U+4ECF, U+4EE4, U+4EEE, U+4EF2, U+4F38, U+4F3A, U+4F9D, U+4FDD, U+4FEE, U+505C, U+50BE, U+50CF, U+5104, U+5146, U+5150, U+515A, U+5175, U+51CD, U+520A, U+5237-5238, U+5247, U+526F, U+5287, U+52C7, U+52DF, U+52E2, U+5339, U+5354, U+53CC, U+53EB-53EC, U+53F2, U+5404, U+542B, U+54B2, U+5510, U+55AB, U+55B6, U+56E3, U+56F2, U+56FA, U+5727, U+574A, U+57CB, U+57F7, U+57FC, U+5854, U+5857, U+5883, U+58C1, U+59D3-59D4, U+5B6B, U+5B87, U+5B99, U+5BAE, U+5C01, U+5C06, U+5C0A, U+5C55, U+5C64, U+5CA1, U+5CA9, U+5CB8, U+5DDE, U+5DE8, U+5DFB, U+5E2F, U+5E3D, U+5E45, U+5E7C, U+5E8A, U+5E95, U+5E9C, U+5EF6, U+5F8B, U+5FA9, U+5FB9, U+5FD7, U+5FDC, U+5FE0, U+5FEB, U+604B, U+6075, U+60A3, U+60A9, U+60D1, U+618E, U+6279, U+627F, U+62C5, U+62DD, U+62E1, U+62FE, U+631F, U+635C, U+6398, U+63A1, U+640D, U+64CD, U+6539, U+6545, U+656C, U+6575, U+65E7, U+6606-6607, U+66B4, U+66C7, U+6761, U+677F, U+679A, U+679D, U+67AF, U+67D4, U+67F1, U+6803-6804, U+685F, U+68B0, U+68D2, U+691C, U+694A, U+6A4B, U+6B27, U+6B66, U+6B74, U+6BBB, U+6BBF, U+6BD2, U+6C38, U+6C88, U+6CB3, U+6CB8, U+6CBC, U+6CC1, U+6CC9, U+6CE5, U+6DB2, U+6DBC, U+6E05, U+6E2C, U+6E56, U+6E6F, U+6E7E-6E7F, U+6EB6, U+6F20, U+6FC3, U+6FEF, U+706F-7070, U+70AD, U+7167, U+71E5, U+7206, U+7248, U+72ED, U+7384, U+73CD, U+74B0, U+74E6, U+74F6, U+7554, U+755C, U+7565, U+7573, U+757F, U+7642, U+7701, U+770B, U+7802, U+786C, U+78E8, U+7948, U+795D, U+7A0E, U+7AE0, U+7AE5, U+7B26, U+7B46, U+7B52, U+7BA1, U+7BC9, U+7C4D, U+7C89, U+7C92, U+7D14, U+7D39, U+7DBF, U+7DCF, U+7DE8, U+7E3E, U+7F36, U+7FA4, U+7FCC, U+8015, U+808C, U+80A9-80AA, U+80AF, U+80C3, U+80F8, U+8102, U+8133, U+8155, U+8170, U+8178, U+819A, U+81D3, U+81E3, U+822A, U+822C, U+82B8, U+8328, U+8352, U+83D3, U+8457, U+84B8, U+8535, U+8840, U+888B, U+88AB, U+88C5, U+88DC, U+88FD, U+8907, U+89E6, U+8A13, U+8A2D, U+8A5E, U+8A70, U+8AB2, U+8C4A, U+8C61, U+8CA9, U+8CAF, U+8CBF, U+8CC3, U+8CDE, U+8CE2, U+8D08, U+8D85, U+8DE1, U+8E0A, U+8ECD, U+8ED2, U+8EDF, U+8F03, U+8F2A, U+8F38, U+9020, U+907A, U+90CA, U+91DD, U+920D, U+9271, U+9285, U+92ED, U+9332, U+961C, U+962A, U+9678, U+9685, U+96BB, U+96C7, U+96F0, U+96F6, U+97D3, U+9818, U+9999, U+99D0, U+9EBB, U+9F3B; }
@font-face { font-family: "Klee One Study"; src: url("/study/fonts/klee-study-n1.eeb7647cc4.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+4E14, U+4E18, U+4E39, U+4E4F, U+4E80, U+4EAB, U+4EAD, U+4EC1, U+4ED9, U+4EF0, U+4F01, U+4F0E-4F10, U+4F2F, U+4F34, U+4F46, U+4F50, U+4F73, U+4F75, U+4F8D, U+4FAE-4FAF, U+4FB5-4FB6, U+4FC3, U+4FCA, U+4FD7, U+4FF3, U+4FF5, U+4FF8, U+5009, U+5023, U+502B, U+5039, U+504F, U+5065, U+5075, U+507D, U+508D, U+5091, U+5098, U+50AC, U+50B2, U+50B5, U+50B7, U+50C5, U+50D5, U+50DA, U+50E7, U+5100, U+5112, U+511F, U+5145, U+514B, U+5178, U+517C, U+5192, U+5197, U+51A0, U+51A5, U+51B6, U+51C4, U+51C6, U+51DD, U+51E1, U+51F6, U+51F8-51F9, U+5203, U+5208, U+5211, U+5239, U+524A, U+5256, U+525B, U+525D, U+5263-5264, U+5270, U+5275, U+529F, U+52A3, U+52B1, U+52BE, U+52C3, U+52C5, U+52D8, U+52E7, U+52F2, U+52FE, U+5320, U+533F, U+5347, U+5351, U+5353, U+535A, U+5373-5374, U+5378, U+5384, U+5398, U+53B3, U+53D4, U+53D9, U+53E5, U+5409, U+540E, U+5410, U+541F, U+5442, U+5448-5449, U+546A, U+54BD, U+54C0, U+54F2, U+54FA, U+5504, U+5506-5507, U+552F, U+5531, U+553E, U+5553, U+559A, U+559D, U+55A9-55AA, U+55E3, U+5606, U+5631-5632, U+564C, U+5674, U+5687, U+56DA, U+570F, U+5751, U+576A, U+5782, U+57A3, U+57F9, U+5800, U+5805-5806, U+5815, U+5824, U+582A, U+5840-5841, U+584A, U+5851, U+585A, U+585E, U+5861, U+587E, U+5893, U+589C, U+58A8, U+58B3, U+58BE, U+58C7, U+58CA, U+58CC, U+58EE, U+58F1, U+5947-5949, U+594F, U+5951, U+5954, U+5968, U+596A, U+596E, U+5974, U+5982-5984, U+598A, U+5996, U+5999, U+59A5, U+59A8, U+59AC, U+59EB, U+59FB, U+59FF, U+5A01, U+5A20, U+5A2F, U+5A46, U+5A7F, U+5A92, U+5A9B, U+5AC1, U+5AC9, U+5ACC, U+5AE1, U+5B22, U+5B54, U+5B64, U+5B97, U+5B9B-5B9C, U+5BA3, U+5BB0, U+5BB4-5BB5, U+5BC2, U+5BC6, U+5BDB, U+5BE1, U+5BE7, U+5BE9, U+5BEE, U+5C04, U+5C09, U+5C0B, U+5C31, U+5C3C-5C3D, U+5C3F, U+5C5E, U+5C65, U+5C90, U+5CAC, U+5CB3, U+5CE0-5CE1, U+5CF0, U+5D07, U+5D0E, U+5D16, U+5D29, U+5D50, U+5DE1, U+5DE3, U+5DE7, U+5E06, U+5E1D, U+5E25, U+5E33, U+5E55, U+5E63, U+5E79, U+5E7B, U+5E7D, U+5E8F, U+5EB6-5EB8, U+5EC3, U+5EC9-5ECA, U+5EF7, U+5F01, U+5F04, U+5F0A, U+5F10, U+5F14, U+5F25-5F27, U+5F3E, U+5F59, U+5F69, U+5F6B, U+5F70-5F71, U+5F80-5F81, U+5F84, U+5F90, U+5F93, U+5FAA, U+5FAE, U+5FB3-5FB4, U+5FCC-5FCD, U+6020, U+6028, U+602A, U+6052, U+6063, U+6068-6069, U+606D, U+6094, U+609F-60A0, U+60A6, U+60BC, U+60DC, U+60E7-60E8, U+60F0, U+6101, U+6109, U+611A, U+6144, U+6148, U+614B, U+614E, U+6155, U+6162, U+6168, U+616E, U+6170, U+6176, U+6182, U+61A4, U+61A7, U+61A9, U+61AC, U+61B2, U+61B6, U+61BE, U+61C7, U+61D0, U+61F2, U+6211-6212, U+622F, U+6234, U+623F, U+6247, U+6249, U+6271, U+6276, U+6284, U+628A, U+6291, U+6297, U+629E, U+62AB, U+62B5, U+62B9, U+62BD, U+62C9, U+62CD, U+62D0, U+62D3, U+62D8-62D9, U+62E0, U+62EC, U+62F3, U+62F7, U+6311, U+6319, U+632B, U+632F, U+633F, U+6349, U+6357, U+636E, U+637B, U+638C, U+6392, U+63A7-63A8, U+63AA, U+63B2, U+63CF-63D0, U+63DA, U+63EE, U+63F4, U+63FA, U+642C-642D, U+643A, U+643E, U+6442, U+6458, U+6469, U+646F, U+6483, U+64A4, U+64AE, U+64B2, U+64C1, U+64E6, U+64EC, U+653B, U+654F, U+6551, U+6562, U+6577, U+658E, U+6590-6591, U+659C, U+65A5, U+65AC, U+65BD, U+65CB, U+65D7, U+65E2, U+65E8, U+65EC, U+65FA, U+6627, U+662D, U+6676, U+6681, U+6687, U+66A6, U+66AB, U+66D6, U+66F9, U+66FD, U+6715, U+6717, U+6731, U+6734, U+673D, U+6749, U+6790, U+67A0, U+67A2, U+67B6, U+67C4, U+67D0, U+67D3, U+67F3, U+67F5, U+6813, U+682A, U+6838, U+683D, U+6841, U+6843, U+6851, U+685C, U+6885, U+6897, U+68A8, U+68C4, U+68CB, U+68DA, U+68DF, U+68FA, U+690E, U+6977, U+697C, U+6982, U+69FD, U+6A19, U+6A21, U+6A39, U+6B04, U+6B3A, U+6B3E, U+6B53, U+6B89-6B8A, U+6B96, U+6BB4, U+6BC0, U+6C3E, U+6C41, U+6C4E, U+6C5F, U+6C70, U+6C7D, U+6C83, U+6C96, U+6C99, U+6CA1-6CA2, U+6CBF, U+6CCC, U+6CE1, U+6CF0, U+6D1E, U+6D2A, U+6D3E, U+6D44, U+6D5C, U+6D66, U+6D6A, U+6D78, U+6DAF, U+6DD1, U+6DE1, U+6DEB, U+6DFB, U+6E07, U+6E09, U+6E0B, U+6E13, U+6E26, U+6E67, U+6E90, U+6E9D, U+6EBA, U+6EC5, U+6ECB, U+6ED1, U+6EDD-6EDE, U+6F02, U+6F06, U+6F0F, U+6F2C, U+6F38, U+6F54, U+6F5C, U+6F5F, U+6F64, U+6F6E, U+6F70, U+6F84, U+6FC0-6FC1, U+6FEB, U+702C, U+707D, U+7089-708A, U+708E, U+70BA, U+70C8, U+714E, U+7169, U+716E, U+718A, U+719F, U+7235, U+723D, U+7259, U+7267, U+7272, U+72A0, U+72C2, U+72D9, U+72E9, U+731B, U+731F, U+732E, U+7336, U+733F, U+7344, U+7363, U+7372, U+73A9, U+73E0, U+73ED, U+7434, U+7460, U+7483, U+74A7, U+74BD, U+751A, U+7532, U+754F, U+755D, U+758E, U+75AB, U+75BE, U+75C7, U+75D5, U+75D8, U+75E2, U+75F4, U+760D, U+7652, U+7656, U+7687, U+76C6, U+76CA, U+76DB, U+76DF, U+76E3, U+76FE, U+7709, U+773A, U+773C, U+7761, U+7763, U+7766, U+77AC-77AD, U+77B3, U+77EF, U+7815, U+7832, U+785D, U+786B, U+7881, U+7891, U+78C1, U+7901, U+790E, U+792B, U+7949, U+7965, U+7968, U+7985, U+798D, U+79C0, U+79D8, U+79DF, U+79E9, U+79F0, U+7A1A, U+7A32, U+7A3C-7A3D, U+7A3F-7A40, U+7A42, U+7A4F, U+7A6B, U+7A83, U+7A92, U+7A9F, U+7AAE-7AAF, U+7ADC, U+7AEF, U+7B1B, U+7B2C, U+7B4B, U+7B56, U+7B87, U+7B8B, U+7BC4, U+7BE4, U+7C3F, U+7C60, U+7C8B, U+7C97-7C98, U+7C9B, U+7CA7, U+7CD6, U+7CE7, U+7CFB, U+7CFE, U+7D00, U+7D0B, U+7D0D, U+7D1A-7D1B, U+7D20-7D22, U+7D2B, U+7D2F, U+7D33, U+7D3A, U+7D5E, U+7D71, U+7D79, U+7D99, U+7DAD, U+7DB1-7DB2, U+7DBB, U+7DCA, U+7DE0, U+7DE9, U+7DEF, U+7DFB, U+7E01, U+7E04, U+7E1B, U+7E26, U+7E2B, U+7E2E, U+7E41, U+7E4A, U+7E54-7E55, U+7E6D, U+7E70, U+7F70, U+7F75, U+7F77, U+7F85, U+7F9E, U+7FA9, U+7FC1, U+7FFB-7FFC, U+8010, U+8017, U+8056, U+8074, U+8096, U+809D, U+80A1-80A2, U+80A5, U+80BA, U+80C6, U+80CE, U+80DE, U+80F4, U+8105, U+8107-8108, U+810A, U+811A, U+8131, U+814E, U+8150, U+816B, U+817A, U+819C, U+81A8, U+81B3, U+81C6, U+81E8, U+81ED, U+81F4, U+81FC, U+8208, U+820E, U+8217, U+8236-8237, U+8247, U+8266, U+8276, U+828B, U+829D, U+82AF, U+82B3, U+82BD, U+82D7, U+82DB, U+8302, U+830E, U+8358, U+83CA, U+83CC, U+83EF, U+840E, U+845B, U+846C, U+8499, U+84C4, U+8511, U+853D, U+85A6, U+85AA-85AB, U+85CD, U+85E4, U+85E9, U+85FB, U+864E, U+8650, U+865A, U+865C, U+865E, U+8679, U+868A, U+8695, U+86C7, U+86CD, U+86EE, U+878D, U+8846, U+885D, U+8861, U+8870, U+8877, U+88C1-88C2, U+88D5, U+88F8, U+88FE, U+8910, U+8912, U+895F, U+8972, U+8986-8987, U+8996, U+89A7, U+8A02-8A03, U+8A0E, U+8A17, U+8A1F, U+8A33-8A34, U+8A3A, U+8A3C, U+8A50, U+8A54, U+8A60, U+8A63, U+8A69, U+8A6E, U+8A72-8A73, U+8A87, U+8A89, U+8A93, U+8A95, U+8A98, U+8AA0, U+8ACB, U+8AE7, U+8AED-8AEE, U+8AFE, U+8B00-8B01, U+8B04, U+8B19, U+8B21, U+8B39, U+8B5C, U+8B72, U+8B77, U+8C5A, U+8C6A, U+8C8C, U+8C9E, U+8CA2, U+8CAA-8CAB, U+8CB4, U+8CC0, U+8CC2, U+8CC4, U+8CCA, U+8CD3, U+8CDC, U+8CE0, U+8CE6, U+8CED, U+8CFC, U+8D05, U+8D66, U+8D74, U+8DA3, U+8DDD, U+8DF3, U+8DF5, U+8E0F, U+8E2A, U+8E8D, U+8ECC, U+8EF8, U+8F09, U+8F1D, U+8F29, U+8F44, U+8FA3, U+8FB1, U+8FC5, U+8FEB, U+8FED, U+900F-9010, U+9013, U+901D, U+902E, U+9038, U+9042, U+9047, U+904D, U+905C, U+9061, U+9063, U+906D-906E, U+9075, U+9077, U+907F, U+9084, U+90A3, U+90A6, U+90AA, U+90B8, U+90CE, U+90E1, U+90ED, U+914C, U+914E, U+9154, U+9162, U+916A, U+916C, U+9175, U+9177-9178, U+9192, U+919C, U+91B8, U+91C8, U+91DC, U+91E3, U+9234, U+925B, U+9262, U+9283, U+9298, U+92AD, U+92F3, U+92FC, U+9320, U+9326, U+932C, U+932E-932F, U+935B, U+938C, U+9396, U+93AE, U+93E1, U+9418, U+9451, U+9591, U+95A3, U+95A5, U+95B2, U+95D8, U+963B, U+9644, U+965B, U+9663, U+9665, U+966A, U+9670, U+9673, U+9675-9676, U+9686, U+968A, U+968F, U+9694, U+9699, U+96A0, U+96A3, U+96B7, U+96C4-96C5, U+96CC, U+96E2, U+96F7, U+9700, U+970A, U+971C, U+9727, U+9732, U+97FB, U+97FF, U+9805, U+9808, U+9811-9813, U+983B, U+984E, U+9855, U+9867, U+98E2, U+98FC-98FE, U+990A, U+990C, U+9913, U+99C4, U+99C6, U+99D2, U+9A0E, U+9A12, U+9A30, U+9A5A, U+9AB8, U+9AC4, U+9B31, U+9B42, U+9B45, U+9B54, U+9BAE, U+9BE8, U+9D8F, U+9DB4, U+9E7F, U+9E93, U+9E97, U+9ED9, U+9F13; }
/* Chirami in your browser (/study/): the app's screens on the site's paper and ink (site.css's colours and type).
   build.py puts the "Klee One Study" @font-face rules above this. Phone first: one column, tabs at the bottom;
   from 900px the tabs move into the top bar. */

/* ---------- the page ---------- */
html[data-study] { scroll-behavior: auto; }
body.study { min-height: 100vh; min-height: 100dvh; }
.study section { padding-block: 0; }
.study .kl, .study .kl[lang="ja"] { font-family: "Klee One Study", var(--jp-sans); font-weight: 400; font-synthesis: none; }
.study h1 { font-size: clamp(28px, 5vw, 38px); }
.study h2 { font-size: 22px; }
.study h3 { font-size: 18px; }
.study .muted { font-size: 15px; }
.study .center { text-align: center; }
.study main:focus, .study h1[tabindex="-1"]:focus { outline: none; } /* focused for screen readers as a screen opens */
.study .btn[disabled] { opacity: .55; cursor: default; filter: none; }
.lead-s { font-size: 17px; line-height: 1.55; color: var(--soft); }
.st-page { width: 100%; max-width: 720px; margin: 0 auto; padding: 18px var(--gutter-r) 40px var(--gutter-l); display: grid; gap: 18px; align-content: start; }
.st-page > * { min-width: 0; }
.st-page.kpage, .st-page.path, .st-page.family { max-width: 1000px; }
.st-intro { padding-top: 48px; text-align: center; justify-items: center; }
.has-tabs main { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }

/* ---------- the top bar, the tabs, the banners ---------- */
.st-top { position: sticky; top: 0; z-index: 6; background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); padding-top: env(safe-area-inset-top, 0px); }
.st-top-in { max-width: 1000px; margin: 0 auto; min-height: 56px; display: flex; align-items: center; padding-left: var(--gutter-l); padding-right: var(--gutter-r); }
.st-top .brand { font-size: 20px; gap: 9px; }
.st-top .brand img { width: 30px; height: 30px; border-radius: 8px; }
.st-tabs { position: fixed; left: 0; right: 0; bottom: 0; z-index: 7; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: color-mix(in srgb, var(--card) 94%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-top: 1px solid var(--line); padding: 4px max(8px, env(safe-area-inset-right, 0px)) calc(4px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px)); }
.st-tabs[hidden] { display: none; }
.st-tab { display: grid; justify-items: center; gap: 2px; padding: 7px 4px 6px; min-height: 56px; border-radius: 12px; color: var(--soft); text-decoration: none; font: 600 12px/1.2 var(--sys); }
.st-tab svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.st-tab.on { color: var(--ink); }
.st-tab.on svg { stroke-width: 2.2; }
.st-tab:hover { color: var(--ink); }
.st-site { display: none; } /* the main site's links: in the top bar on wide screens, in Settings on every size */
@media (min-width: 900px) {
  .st-site { display: flex; align-items: center; gap: 2px; margin-left: 10px; padding-left: 12px; border-left: 1px solid var(--line); }
  .st-site a { padding: 8px 10px; border-radius: 10px; color: var(--soft); text-decoration: none; font: 600 14px/1.2 var(--sys); }
  .st-site a:hover { color: var(--ink); background: var(--bg2); }
  .st-tabs { left: auto; right: max(var(--gutter-r), calc((100vw - 1000px) / 2 + 20px)); bottom: auto; top: env(safe-area-inset-top, 0px); height: 56px; display: flex; gap: 4px; align-items: center; background: none; border: 0; padding: 0; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .st-tab { display: flex; align-items: center; gap: 7px; min-height: 40px; padding: 8px 12px; font-size: 15px; }
  .st-tab svg { width: 20px; height: 20px; }
  .st-tab.on { background: var(--bg2); }
  .has-tabs main { padding-bottom: 0; }
}
.st-update { position: sticky; top: calc(57px + env(safe-area-inset-top, 0px)); z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; padding: 10px var(--gutter-r) 10px var(--gutter-l); background: var(--wash); font-size: 15px; font-weight: 600; text-align: center; }
.st-update[hidden] { display: none; }
.st-toast { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 9; width: max-content; max-width: calc(100vw - 32px); padding: 12px 18px; border-radius: 14px; background: var(--ink); color: var(--bg); font-size: 15px; font-weight: 600; line-height: 1.4; text-align: center; box-shadow: 0 14px 34px -14px rgba(0,0,0,.5); opacity: 0; transform: translate(-50%, 8px); transition: opacity .2s ease, transform .2s ease; pointer-events: none; }
.st-toast.on { opacity: 1; transform: translate(-50%, 0); }
.has-tabs .st-toast { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
@media (min-width: 900px) { .has-tabs .st-toast { bottom: 28px; } }
.st-warn { padding: 12px 14px; border-radius: 12px; background: var(--wash); font-size: 15px; line-height: 1.5; }
.st-error { color: var(--accent); font-weight: 600; }
.st-loading { padding-block: 48px; text-align: center; color: var(--soft); }
.mock-banner { padding: 10px 14px; border-radius: 12px; border: 1.5px dashed var(--accent); color: var(--soft); font-size: 14px; line-height: 1.45; }

/* ---------- controls ---------- */
.btn.wide { width: 100%; max-width: 440px; }
.btn.on-dark { background: var(--night-ink); color: var(--night); }
.btn.ghost.danger { color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent); }
.st-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 4px; }
.linkish { display: inline; min-height: 24px; padding: 2px 0; border: 0; background: none; color: var(--accent); font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.st-back { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0 0 3px; border-radius: 50%; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); font: 400 28px/1 var(--sys); cursor: pointer; }
.st-back:hover { border-color: var(--soft); }
.k-top { display: flex; align-items: center; gap: 12px; min-height: 44px; }
.k-top .muted { flex: 1; text-align: center; padding-right: 56px; }
.sub-h { font: 700 15px/1.4 var(--sys); color: var(--soft); letter-spacing: 0; }
.bar { position: relative; height: 8px; border-radius: 99px; background: var(--line); overflow: hidden; }
.bar > span { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: var(--ink); }
.drop { display: inline-block; width: 11px; height: 11px; border-radius: 50% 0 50% 50%; transform: rotate(-45deg); background: var(--ink); }
.drop.big { width: 34px; height: 34px; background: var(--accent); justify-self: center; margin: 12px 0 6px; }
.round { flex: none; display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); font-size: 15px; cursor: pointer; }
.round:hover { border-color: var(--ink); }
.pill-s { display: inline-block; margin-left: 6px; padding: 3px 8px; border-radius: 99px; background: var(--accent); color: var(--accent-ink); font: 700 11px/1.3 var(--sys); letter-spacing: .02em; vertical-align: 2px; }
.choices { display: grid; gap: 10px; }
.choice { display: grid; gap: 2px; width: 100%; min-height: 56px; padding: 12px 16px; border-radius: 14px; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); text-align: left; font: inherit; cursor: pointer; }
.choice:hover { border-color: var(--soft); }
.choice.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); background: color-mix(in srgb, var(--wash) 60%, var(--card)); }
.choice-t { font-weight: 700; font-size: 17px; line-height: 1.3; }
.choice-s { font-size: 14px; line-height: 1.4; color: var(--soft); }
.dots { display: flex; gap: 6px; align-items: center; }
.dots span { width: 8px; height: 8px; border-radius: 50%; background: var(--line); }
.dots span.on { background: var(--accent); }

/* ---------- onboarding ---------- */
.ob { max-width: 560px; }
.ob-top { display: flex; align-items: center; justify-content: space-between; min-height: 44px; }
.ob-top > span:first-child { width: 44px; }
.ob-plan { list-style: none; margin: 0; padding: 0; border-radius: 16px; border: 1px solid var(--line); background: var(--card); overflow: hidden; }
.ob-plan li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; padding: 13px 16px; font-weight: 600; }
.ob-plan li + li { border-top: 1px solid var(--line); }
.ob-plan .muted { font-weight: 400; }
.ob .muted { text-align: center; }

/* ---------- the Welcome: kanji stories first ---------- */
.ob-welcome { max-width: 1000px; gap: 10px; }
.ob-welcome .ob-top { min-height: 16px; justify-content: center; }
.ob-welcome .ob-top > span:first-child { display: none; }
.wl { display: grid; gap: 14px; justify-items: center; text-align: center;
  grid-template-areas: "title" "show" "lead" "start"; }
.wl > h1 { grid-area: title; font-size: clamp(27px, 7.2vw, 46px); }
.wl > .wl-show { grid-area: show; }
.wl > .lead-s { grid-area: lead; max-width: 34rem; font-size: 16px; }
.wl > .st-actions { grid-area: start; width: 100%; margin-top: 0; }
.wl-show { display: grid; gap: 12px; justify-items: center; width: 100%; }
/* A single kanji's square is bigger than each half of 海老's, so every story fills about the same height; the
   stage keeps the tallest one's room, so nothing below it moves. */
.wl-stage { width: 100%; gap: 8px; align-content: start; min-height: 322px; --size: min(164px, 42vw); --size1: min(196px, 50vw); }
.wl-stage .ksq { --size: inherit; }
.wl-stage .ksq:not(.wide) { --size: var(--size1); }
@media (max-width: 379px) { .wl-stage { min-height: 330px; } }
.wl-stage .kplay { display: none !important; } /* no button on the stage while it plays */
.wl-stage .kstory { max-width: 26rem; gap: 4px; align-content: start; }
.wl-stage .ks-end { gap: 4px; }
.wl-stage .ks-k { font-size: 26px; }
.wl-stage .ks-line { font-size: 16px; line-height: 1.45; }
.wl-stage .ks-parts { font-size: 15px; }
.wl-stage .ks-parts .kl { font-size: 19px; }
.wl-stage .ks-note { display: none; }
.wl-stage:focus { outline: none; }
.wl-stage.wait .ks-end { visibility: hidden; } /* until its story starts */
/* From one story to the next: it fades out over the end of its hold, and the next fades in (app.js, PACE.fade). */
.wl-stage > * { transition: opacity .25s ease; }
.wl-stage.wl-out > * { opacity: 0; }
.wl-stage.wl-new > * { animation: wl-in .25s ease; }
@keyframes wl-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .wl-stage > * { transition: none; } .wl-stage.wl-new > * { animation: none; } }
.wl-foot { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; width: 100%; max-width: 440px; min-height: 40px; }
.wl-dots { grid-column: 2; display: flex; gap: 7px; }
.wl-dots span { width: 8px; height: 8px; border-radius: 50%; background: var(--line); transition: background .3s ease; }
.wl-dots span.on { background: var(--accent); }
.wl-dots span.done { background: var(--ink); }
.wl-replay { grid-column: 3; justify-self: start; min-height: 40px; padding: 7px 16px; font-size: 15px; }
.wl-replay[hidden] { display: inline-flex; visibility: hidden; } /* keeps its place: nothing moves when it shows */
@media (prefers-reduced-motion: reduce) { .wl-dots span { transition: none; } }
@media (min-width: 900px) {
  .ob-welcome { padding-top: 28px; }
  .wl { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); grid-template-rows: 1fr auto auto auto 1fr; column-gap: 56px; row-gap: 18px;
    grid-template-areas: ". show" "title show" "lead show" "start show" ". show"; justify-items: start; text-align: left; }
  .wl > h1 { font-size: 46px; }
  .wl > .lead-s { font-size: 18px; }
  .wl > .st-actions { justify-content: flex-start; }
  .wl-stage { --size: 218px; --size1: 250px; min-height: 376px; }
  .wl-show { justify-self: stretch; }
}

/* the stages that play by themselves: a small Pause/Play in the corner (WCAG 2.2.2) */
.wl-show { position: relative; }
.seq-pause { position: absolute; top: 0; right: 0; z-index: 2; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border-radius: 50%; border: 1.5px solid var(--line); background: color-mix(in srgb, var(--card) 85%, transparent); color: var(--soft); cursor: pointer; }
.seq-pause:hover { color: var(--ink); border-color: var(--soft); }
.seq-pause[hidden] { display: none; }
.seq-pause svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.seq-pause .i-play { display: none; fill: currentColor; stroke-width: 1.5; }
.seq-pause.held .i-pause { display: none; }
.seq-pause.held .i-play { display: inline; }
.wl-foot.solo { grid-template-columns: 1fr; justify-items: center; }
.wl-foot.solo .wl-replay { grid-column: 1; justify-self: center; }

/* step 2: everything about each kanji */
.ob-welcome.ob-tour .ob-top { justify-content: space-between; min-height: 44px; } /* back, then the dots, as on the other steps */
.ob-tour .wl { grid-template-areas: "title" "show" "start"; }
.ob-tour .wl > .tr-next { grid-area: start; width: 100%; margin-top: 0; }
.tr-stage { width: 100%; gap: 12px; align-content: start; --size: min(150px, 40vw); }
.tr-stage .ksq { --size: inherit; }
.tr-stage .kplay { display: none !important; }
.tr-info { display: grid; gap: 10px; justify-items: center; width: 100%; max-width: 440px; }
.tr-reads { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.tr-chip { display: inline-flex; align-items: baseline; gap: 2px 8px; padding: 8px 14px; border-radius: 14px; background: var(--sq); border: 1.5px solid var(--line); white-space: nowrap; }
.tr-chip .kr-kana { font-size: 22px; line-height: 1.2; }
.tr-word { width: 100%; text-align: left; padding: 10px 16px; }
.tr-word .kw-w { font-size: 26px; }
.tr-family { display: grid; gap: 8px; width: 100%; }
.tr-fam-h { font: 700 15px/1.4 var(--sys); color: var(--soft); }
.tr-tiles.tiles.big { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.tr-tiles .tile.big { min-height: 66px; padding: 6px 2px; }
.tr-tiles .tile.big .tile-c { font-size: 26px; }
.tr-tiles .tile-m { font-size: 11px; }
.tr-item { visibility: hidden; opacity: 0; transition: opacity .3s ease, visibility 0s linear .3s; }
.tr-item.on { visibility: visible; opacity: 1; transition: opacity .3s ease; }
@media (prefers-reduced-motion: reduce) { .tr-item, .tr-item.on { transition: none; } }
@media (min-width: 900px) {
  .ob-tour .wl { grid-template-areas: ". show" "title show" "start show" ". show"; grid-template-rows: 1fr auto auto 1fr; }
  .tr-stage { --size: 200px; }
  .tr-chip .kr-kana { font-size: 24px; }
}

/* a word's practice square: two squares wide, a kanji in each half */
.ksq.wide { width: calc(var(--size) * 2); background-size: 100% 1px, 1px 100%; background-image: repeating-linear-gradient(90deg, var(--sq-line) 0 5px, transparent 5px 10px), linear-gradient(var(--sq-line), var(--sq-line)); }
.ksq-pair { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
.ksq-pair .kl { display: grid; place-items: center; font-size: calc(var(--size) * .8); line-height: 1; }
.ks-read { color: var(--soft); font-size: 15px; }
.ks-read .kl { font-size: 18px; color: var(--ink); }
.ks-mean { font-weight: 700; font-size: 17px; }

/* ---------- the paywall ---------- */
.pw { max-width: 560px; gap: 16px; }
.pw-close { display: flex; align-items: center; justify-content: space-between; min-height: 44px; }
.pw-close .btn { margin: 0 0 0 auto; }
.pw-perks { font-size: 16px; }
.pw-plans { display: grid; gap: 10px; }
.plan-c { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 14px; }
.plan-c .choice-t, .plan-c .choice-s { grid-column: 1; }
.plan-price { grid-column: 2; grid-row: 1 / span 2; font-weight: 700; font-size: 17px; white-space: nowrap; }
.pw-buy { display: grid; gap: 10px; justify-items: center; text-align: center; }
.pw-fine { display: grid; gap: 4px; font-size: 14px; line-height: 1.5; color: var(--soft); max-width: 440px; }
.pw-disclose { color: var(--ink); font-weight: 600; }
.pw-fine p:empty { display: none; }
.pw-line, .pw-note { font-size: 14px; line-height: 1.5; color: var(--soft); text-align: center; }
.pw-line { color: var(--ink); }
.pw-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 6px; font-size: 14px; color: var(--soft); text-align: center; }

/* ---------- Today ---------- */
.today-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.streak { display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: 99px; border: 1.5px solid var(--line); background: var(--card); font-weight: 700; font-size: 14px; white-space: nowrap; }
.fading { display: grid; gap: 14px; padding: 20px; border-radius: 22px; background: var(--night); color: var(--night-ink); }
.fading-row { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.fading h2 { font: 700 19px/1.3 var(--sys); color: var(--night-ink); }
.fading p { color: var(--night-soft); font-size: 14px; margin-top: 2px; }
.fading-k { flex: none; white-space: nowrap; }
.fading-k .kl { font-size: 38px; line-height: 1; letter-spacing: .04em; color: var(--night-ink); }
.fading .btn { max-width: none; }
.caught { padding: 18px 20px; border-radius: 22px; background: var(--card); border: 1px solid var(--line); display: grid; gap: 4px; }
.caught h2 { font: 700 18px/1.3 var(--sys); }
.caught p { color: var(--soft); font-size: 15px; }
.new-today { display: grid; gap: 10px; }
.new-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 10px; }
.new-card { display: grid; justify-items: center; align-content: center; gap: 3px; min-height: 128px; height: 100%; padding: 12px 6px; border-radius: 16px; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); text-decoration: none; text-align: center; }
.new-card:hover { border-color: var(--soft); }
.new-card.next { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.new-card.learned { background: transparent; }
.nc-k { font-size: 40px; line-height: 1.15; }
.nc-m { font-size: 13px; line-height: 1.3; font-weight: 600; overflow-wrap: anywhere; }
.nc-t { font-size: 12px; color: var(--soft); }
.new-card.learned .nc-t { color: var(--accent); font-weight: 700; }
.more-pro { display: grid; gap: 8px; justify-items: start; padding: 18px 20px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); }
.more-pro-t { font-weight: 700; }
.more-pro p { color: var(--soft); font-size: 15px; }
.scroll-progress { display: grid; gap: 10px; padding: 18px 20px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); }
.sp-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.scroll-progress .muted { font-size: 14px; }

/* ---------- Path ---------- */
.path { gap: 6px; }
.path-level { position: relative; padding: 0 0 26px 30px; }
.path-level::before { content: ""; position: absolute; left: 6px; top: 22px; bottom: -6px; width: 2px; background: var(--line); }
.path-level:last-child::before { display: none; }
.pl-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }
.pl-head h2 { font-size: 24px; }
.pl-head .muted { margin-left: auto; font-size: 14px; }
.pl-node { position: absolute; left: 0; top: 8px; width: 14px; height: 14px; border-radius: 50%; border: 2.5px solid var(--ink); background: var(--bg); }
.done .pl-node { background: var(--accent); border-color: var(--accent); }
.pl-body { content-visibility: auto; }
.tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(50px, 1fr)); gap: 8px; }
.tiles li { min-width: 0; }
.tile { position: relative; display: grid; place-items: center; aspect-ratio: 1; border-radius: 11px; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); text-decoration: none; }
.tile-c { font-size: 26px; line-height: 1; }
.tile:hover { border-color: var(--soft); }
.tile.st-learning, .tile.st-review, .tile.st-known { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.tile.locked { background: transparent; border-style: dashed; color: var(--faint); }
.tile.here { box-shadow: 0 0 0 2.5px var(--bg), 0 0 0 5px var(--accent); }
.tile-dot { position: absolute; top: 5px; right: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 1.5px var(--card); }
.tiles.big { grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 10px; }
.tile.big { aspect-ratio: auto; min-height: 88px; height: 100%; align-content: center; gap: 3px; padding: 8px 4px; }
.tile.big .tile-c { font-size: 32px; }
.tile-m { font-size: 12px; line-height: 1.25; color: var(--soft); text-align: center; overflow-wrap: anywhere; hyphens: auto; }
.tile.st-learning .tile-m, .tile.st-review .tile-m, .tile.st-known .tile-m { color: color-mix(in srgb, var(--bg) 78%, var(--ink)); }
@media (max-width: 400px) { .tiles { grid-template-columns: repeat(auto-fill, minmax(46px, 1fr)); gap: 7px; } .tile-c { font-size: 24px; } .path-level { padding-left: 26px; } }

/* ---------- a kanji ---------- */
.kpage { gap: 22px; }
.kpage .kp-top { padding-top: 0; }
.k-mean { font-size: clamp(32px, 5vw, 42px); overflow-wrap: anywhere; }
.chip-plain { display: inline-flex; align-items: baseline; gap: 10px; padding: 10px 16px; border-radius: 14px; background: var(--sq); border: 1.5px solid var(--line); justify-self: start; }
.chip-plain .kl { font-size: 26px; line-height: 1.1; }
.study .kword { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.study .kword > div { display: grid; gap: 2px; min-width: 0; }
.k-actions { position: sticky; bottom: 0; z-index: 3; margin: 0 calc(-1 * var(--gutter-r)) 0 calc(-1 * var(--gutter-l)); padding: 18px var(--gutter-r) calc(14px + env(safe-area-inset-bottom, 0px)) var(--gutter-l); background: linear-gradient(to bottom, transparent, var(--bg) 34%); }
.study .kparts { padding: 20px; }
.family { gap: 22px; }
.fam-head { display: grid; justify-items: center; gap: 4px; text-align: center; }
.fam-part { font-size: 76px; line-height: 1.1; color: var(--accent); }
.family section { display: grid; gap: 10px; }

/* ---------- Review ---------- */
.review { max-width: 560px; min-height: calc(100vh - 57px); min-height: calc(100dvh - 57px); grid-template-rows: auto minmax(300px, 1fr) auto auto; }
.rv-top { display: flex; align-items: center; gap: 12px; }
.rv-top .bar { flex: 1; }
.rv-top .muted { font-size: 14px; white-space: nowrap; }
.rv-card { display: grid; justify-items: center; align-content: center; gap: 10px; min-height: 300px; padding: 28px 20px; border-radius: 26px; background: var(--sq); box-shadow: 0 0 0 1px var(--line), 0 24px 48px -34px rgba(0,0,0,.4); text-align: center; }
.rv-k { font-size: clamp(104px, 30vw, 136px); line-height: 1.05; }
.rv-q { color: var(--soft); font-size: 17px; }
.rv-m { font: 700 30px/1.25 var(--head); overflow-wrap: anywhere; }
.rv-r { color: var(--soft); font-size: 16px; white-space: pre-wrap; }
.rv-r .kl { font-size: 1.15em; color: var(--ink); }
.rv-w { display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 10px; margin-top: 4px; padding: 10px 16px; border-radius: 14px; border: 1.5px solid var(--line); font-size: 14px; color: var(--soft); }
.rv-w > .kl { font-size: 22px; color: var(--ink); }
.rv-buttons { display: grid; justify-items: center; padding-bottom: env(safe-area-inset-bottom, 0px); }
.rv-grades { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; width: 100%; }
.rv-grades .btn { padding-inline: 8px; }
.rv-grades .btn:not(.ghost) { background: var(--ink); color: var(--bg); }
.rv-grades .again { color: var(--accent); box-shadow: inset 0 0 0 2px var(--accent); }
.rv-keys { text-align: center; font-size: 13px !important; }
@media (hover: none) { .rv-keys { display: none; } }
.review-done { max-width: 560px; justify-items: center; text-align: center; padding-top: 40px; }

/* ---------- Scroll ---------- */
.scroll-page { max-width: 560px; justify-items: center; }
.pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.pill-c { display: inline-flex; align-items: center; min-height: 40px; padding: 7px 15px; border-radius: 99px; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); text-decoration: none; font-weight: 700; font-size: 15px; }
.pill-c.on { background: var(--ink); border-color: var(--ink); color: var(--bg); }
.hanging { --ink: #1C1B1A; --soft: #5B554C; --line: #DDD3C2; display: grid; justify-items: center; width: 100%; max-width: 380px; color: var(--ink); }
.rod { display: block; width: 100%; height: 14px; border-radius: 7px; background: #3B2E25; position: relative; z-index: 1; }
.sc-paper { display: grid; gap: 16px; width: calc(100% - 24px); padding: 24px 22px 22px; background: #F8F3EA; box-shadow: 0 16px 34px -18px rgba(40, 34, 26, .5); }
.sc-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.sc-head h2 { font-size: 24px; color: var(--ink); }
.sc-head .muted { font-size: 13px; white-space: nowrap; }
.sc-chars { display: grid; grid-template-columns: repeat(auto-fill, 32px); gap: 8px; justify-content: start; }
.sc-chars .kl { display: grid; place-items: center; height: 34px; font-size: 27px; line-height: 1; color: var(--ink); }
.sc-todo { height: 34px; border-radius: 6px; border: 1.5px dashed #B9AE9C; }
.sc-seals { display: flex; flex-wrap: wrap; gap: 6px; }
.seal { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 6px; background: #B8432B; color: #F8F3EA; transform: rotate(-4deg); font-size: 20px; }
.seal .kl { color: #F8F3EA; }
.seal.small { font: 700 13px/1 var(--head); }
.sc-foot { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; padding-top: 6px; }
.sc-streak { font-weight: 700; font-size: 14px; }
.sc-foot .muted { font-size: 13px; }
.sc-foot > .seal { width: 48px; height: 48px; font-size: 28px; }
.scroll-page .st-actions { width: 100%; }

/* ---------- Settings, About, Sources ---------- */
.settings, .about, .sources { gap: 22px; }
.set-sec { display: grid; gap: 8px; }
.sec-t { font: 700 13px/1.4 var(--sys) !important; letter-spacing: .07em; text-transform: uppercase; color: var(--soft); padding-left: 4px; }
.set-card { display: grid; padding: 6px 18px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); }
.about .set-card, .sources .set-card { gap: 8px; padding: 16px 18px; }
.set-card h2.set-t { font: 700 17px/1.35 var(--sys); }
.set-label { padding-top: 12px; padding-bottom: 8px; font-weight: 700; }
.set-card .choices { grid-template-columns: repeat(3, minmax(0, 1fr)); padding-bottom: 12px; }
.set-card .choice { min-height: 48px; padding: 10px 6px; text-align: center; justify-items: center; }
.set-card .choice-t { font-size: 15px; }
.set-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; min-height: 56px; padding: 12px 0; border: 0; border-top: 1px solid var(--line); background: none; color: var(--ink); font: inherit; text-align: left; text-decoration: none; }
.set-card > .set-row:first-child, .set-card > .set-label + .choices + .set-row { border-top: 0; }
.set-label + .choices + .set-row { border-top: 1px solid var(--line) !important; }
.set-row > span:first-child { display: grid; gap: 2px; min-width: 0; }
.set-t { font-weight: 600; font-size: 16px; }
.set-row .muted { font-size: 14px; }
.link-row { cursor: pointer; }
.link-row:hover .set-t { color: var(--accent); }
.link-row .chev { color: var(--soft); font-weight: 700; }
.set-row.danger .set-t { color: var(--accent); }
.set-row[hidden] { display: none; }
.set-row a { font-weight: 600; }
.set-row select { min-height: 44px; max-width: 66%; padding: 8px 12px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--bg); color: var(--ink); font: 600 15px/1.2 var(--sys); }
.switch input[role="switch"] { appearance: none; -webkit-appearance: none; flex: none; position: relative; width: 50px; height: 30px; margin: 0; border-radius: 99px; background: var(--line); cursor: pointer; transition: background .15s ease; }
.switch input[role="switch"]::after { content: ""; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%; background: #FFFFFF; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .15s ease; }
.switch input[role="switch"]:checked { background: var(--accent); }
.switch input[role="switch"]:checked::after { transform: translateX(20px); }
.key-box { display: grid; gap: 8px; padding: 14px 0 16px; border-top: 1px solid var(--line); }
.pro-key { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pro-key code { font: 700 16px/1.3 ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: .05em; user-select: all; overflow-wrap: anywhere; }
.pro-key .btn { margin: 0; }
.key-box .btn.small { margin: 0; }
.set-card .mock-banner { margin-bottom: 14px; }
.about-name { font: 700 26px/1.2 var(--head); }

/* ---------- dialogs: confirmations, a Pro key, the test checkout ---------- */
.st-dialog, .mock-checkout { width: min(440px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 24px; border: 0; border-radius: 22px; background: var(--card); color: var(--ink); box-shadow: 0 30px 70px -20px rgba(0,0,0,.5); }
.st-dialog[open], .mock-checkout[open] { display: grid; gap: 14px; }
.st-dialog::backdrop, .mock-checkout::backdrop { background: rgba(20, 18, 16, .5); }
.st-dialog h2, .mock-checkout h2 { font-size: 22px; }
.st-dialog p, .mock-checkout p { color: var(--soft); font-size: 15px; line-height: 1.5; }
.mock-checkout .mock-checkout-plan { color: var(--ink); font-weight: 700; font-size: 17px; }
.dlg-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 4px; }
.key-field { display: grid; gap: 6px; font-weight: 600; font-size: 15px; }
.key-field input { width: 100%; min-height: 50px; padding: 10px 14px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--bg); color: var(--ink); font: 600 17px/1.2 ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: .04em; text-transform: uppercase; }
.key-field input::placeholder { color: var(--faint); }
.key-msg { min-height: 1.5em; }

@media (prefers-reduced-motion: reduce) {
  .st-toast, .switch input[role="switch"], .switch input[role="switch"]::after { transition: none; }
}
