/* FilmLook mobile web. Colours arrive from /api/config as CSS variables; these are the defaults.

   Everything scales from one fluid root size: 15 px on a small phone, 18 px on a desktop, with
   type, spacing and icons in rem so they move together. The column stays a comfortable reading
   width on any screen, and the card section becomes two columns where there is room. */
/* Self-hosted display faces (SIL OFL 1.1, see web/fonts/README.md): a Japanese-designed mincho for
   names and headlines, a rounded gothic for labels. Subsets of the interface's own characters. */
/* fonts:start (tools/build_web_fonts.py) */
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-0.woff2?v=0a7ae104b4") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+20-7E, U+B0-B1, U+B7, U+C9, U+D7, U+E1, U+E3, U+E9, U+ED, U+EF, U+F4, U+F7, U+2013-2014, U+2018-2019, U+201C-201D, U+2026, U+2190-2193, U+2605-2606, U+2661, U+3001-3002, U+300A-3011, U+4E00, U+4E09-4E0B, U+4E0D-4E0E, U+4E24, U+4E2A, U+4E2D, U+4E3A-4E3B, U+4E48, U+4E4B, U+4E5F, U+4E86, U+4EAE, U+4EBA, U+4ECE, U+4EE5, U+4F1A, U+4F4D-4F4E, U+4F60, U+4F8B, U+4FDD, U+504F, U+50CF, U+5149, U+514B, U+518D, U+5199, U+51C6, U+51E0, U+51FA, U+5206, U+5229, U+5230, U+524D, U+52A0, U+52A8, U+5339, U+5361, U+5377, U+53BB, U+53CD, U+53D1, U+53D8, U+53EA, U+53EF-53F0, U+540C-540E, U+548C, U+56FD-56FE, U+5728, U+5730, U+573A, U+578B, U+591A, U+5927, U+5929, U+5934, U+597D, U+5B50, U+5B58, U+5B83, U+5B89, U+5B9E, U+5BC6, U+5BF9, U+5C0F, U+5C14, U+5C31, U+5C42, U+5DEE, U+5DF2, U+5E03, U+5E08, U+5E38, U+5E73-5E74, U+5EA6, U+5F00, U+5F20, U+5F69, U+5F71, U+5F97, U+5FB7, U+6027, U+611F, U+6210, U+6216, U+6240, U+6253, U+628A, U+62C9, U+62CD, U+62DF, U+63A5, U+6444, U+6536, U+6570, U+65AF, U+65B9, U+65E0, U+65E5, U+65F6, U+660E, U+662F, U+666F, U+6696, U+66F4, U+6700, U+6709, U+672C, U+673A, U+6765, U+6790, U+679C, U+67D4, U+6807, U+6837, U+683C, U+6A21, U+6B21, U+6B63, U+6BD4, U+6C34, U+6CA1, U+6CD5, U+6D4B, U+6DF1, U+706F, U+70B9, U+7167, U+7247-7248, U+7279, U+73B0, U+751F, U+7528, U+7535, U+753B, U+767D, U+7684, U+76F8, U+770B, U+7740, U+786E, U+793A, U+79CD, U+7A7A, U+7C92, U+7EA2, U+7EBF, U+7ED3, U+7EFF, U+7F8E, U+80F6, U+80FD, U+81EA, U+8272, U+82B1, U+84DD, U+88AB, U+897F, U+89D2, U+8BC4, U+8BD5, U+8BF4, U+8BF7, U+8C03, U+8D77, U+8F66, U+8FC7, U+8FD1, U+8FD8-8FD9, U+9009, U+9053, U+90A3, U+90FD, U+914D, U+91CC, U+91CF, U+955C, U+95E8, U+95F4, U+9759, U+9762, U+9897, U+989C, U+98CE, U+9971, U+9996, U+9AD8, U+9EC4, U+9ED1, U+FF01, U+FF05, U+FF08-FF09, U+FF0C, U+FF1A-FF1B, U+FF1F, U+FFE5; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-1.woff2?v=6a6f23fedc") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E8E, U+4E94, U+4E9A, U+4EC0, U+4ED6, U+4EE3, U+4EF6, U+4F3C, U+4F53, U+4F55, U+4F5C, U+4FE1, U+5165, U+5168, U+5170, U+5176, U+5185, U+51B7, U+5224, U+5316, U+5341, U+534A, U+539F, U+53C2, U+5404, U+5408, U+5411, U+54C1, U+54EA, U+56DE, U+56E0, U+56F4, U+5708, U+5747, U+57FA, U+5904, U+591C, U+592A, U+5B66, U+5B8C, U+5B9A, U+5BB6, U+5C11, U+5E26, U+5E76, U+5F0F, U+5F88, U+5FEB, U+6211, U+624B, U+6362, U+636E, U+6539, U+6548, U+6574, U+6587, U+65AD, U+65B0, U+663E, U+6697, U+6708, U+670D, U+6761, U+6784, U+6A59, U+6BCF, U+6D77, U+6E05, U+7126, U+7269, U+7406, U+7530, U+7559, U+7565, U+767E, U+76F4, U+771F, U+773C, U+7801, U+79BB, U+7A97, U+7B2C, U+7B49, U+7EA6, U+7EC6, U+7ECF, U+7ED9, U+7EF4, U+7F57, U+7F6E, U+8005, U+800C, U+80A4, U+83B1, U+85CF, U+884C, U+8857, U+8868, U+8981, U+89C1-89C2, U+89C6, U+89C9, U+8A00, U+8BA9, U+8BB0, U+8BED, U+8BFB, U+8D70, U+8FB9, U+8FDB, U+9002, U+90E8, U+91CD, U+91D1, U+957F, U+95EA, U+9634, U+9752, U+9E1F; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-2.woff2?v=8f1333e8ca") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E1C, U+4E45, U+4E4E, U+4E66, U+4E8C, U+4E9B, U+4EAB, U+4EB2, U+4EEC, U+4F20, U+4F2F-4F30, U+4F46, U+503C, U+505A, U+505C, U+5148, U+5173, U+518C, U+51B2, U+522B, U+523B, U+52A1, U+533A, U+5355, U+5357, U+5360, U+53C8, U+53D6, U+53E5, U+5409, U+5546, U+559C, U+5706, U+5750, U+5757, U+5858, U+58EB, U+5907, U+590D, U+5916, U+5982, U+5B57, U+5BB9, U+5BCC, U+5C45, U+5C71, U+5DDD, U+5DF1, U+5DF4, U+5E45, U+5E72, U+5F3A, U+5F53, U+5F55, U+5F62, U+5FC3, U+60C5, U+624D, U+62FF, U+6301, U+6309, U+6392, U+652F, U+653E, U+66DD, U+6781, U+67B6, U+67E5, U+6811, U+6846, U+68EE, U+6CB9, U+6D53, U+6E21, U+6E29, U+6EE1, U+70C8, U+72D7, U+72EC, U+767B, U+7761, U+79F0, U+7AD9, U+7AEF, U+7B80, U+7C73, U+7C89, U+7C97, U+7D20, U+7D22, U+7D2B, U+7F13, U+8003, U+8096, U+80CC, U+8111, U+81F4, U+8377, U+843D, U+8482, U+89E3, U+8BA1, U+8BBE, U+8BFE, U+8C01, U+8D28, U+8D8A, U+8F6C, U+8F83, U+8FDC, U+901A, U+964D, U+96C6, U+96E8, U+975E, U+9999, U+9A6C, U+9A8C, U+9C81; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-3.woff2?v=156a663347") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E01, U+4E07, U+4E16, U+4E39, U+4E92, U+4EFB, U+4EFD, U+4F1E, U+4F26, U+5019, U+5143, U+516C, U+51C0, U+5220, U+5236, U+5267, U+5343, U+5382, U+5386, U+53E0, U+53EB, U+53F2, U+5427, U+54C8, U+5668, U+56DB, U+56ED, U+57C3, U+57CE, U+585E, U+586B, U+592B, U+5931, U+5947, U+5957, U+5965, U+59C6, U+59CB, U+5A01, U+5B64, U+5BBD, U+5BFC, U+5C3C, U+5DE5, U+5E02, U+5E15, U+5E7F, U+5EFA, U+5F17, U+6001, U+60F3, U+610F, U+6237, U+623F, U+6247, U+627E, U+6389, U+63A8, U+63D0, U+659C, U+65E7, U+6728, U+677E-677F, U+6797, U+6843, U+6865, U+6885, U+6A2A, U+6B3E, U+6B64, U+6C5F, U+6C99, U+6CE8, U+6D1B, U+6D41, U+6D45, U+6D6A, U+6E38, U+6E90, U+7136, U+7231, U+7403, U+745E, U+74E6, U+7531, U+754C, U+75D5, U+77E5, U+786C, U+79D2, U+7CBE, U+7CFB, U+7EC4, U+7EDF, U+7F51, U+8001, U+8282, U+8428, U+88C5, U+8BA4, U+8BD7, U+8DDD, U+8DEF, U+8DF3, U+8EAB, U+8FD0, U+8FDE, U+8FF9, U+90C1, U+91CE, U+9501, U+9510, U+9664, U+968F, U+96EA, U+9700, U+9760, U+98DE, U+9986; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-4.woff2?v=39aecdb5a0") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E03, U+4E1D, U+4E25, U+4E54, U+4E70, U+4EA4, U+4EA7, U+4ECA, U+4F0A, U+4F4F, U+4F7F, U+5012, U+516D, U+517B, U+51AC, U+51B0, U+51B3, U+5207, U+5217-5218, U+526A, U+529B, U+5300, U+5317, U+5348, U+535A, U+5370, U+53CA, U+53E6, U+53F6-53F8, U+5417, U+5458, U+5468, U+5473, U+571F, U+5723, U+5766, U+57DF, U+5899, U+590F, U+5973, U+5979, U+5B63, U+5B69, U+5BA2, U+5BA4, U+5BDF, U+5C40, U+5C4B, U+5E0C, U+5E7D, U+5E97, U+5FAE, U+5FF5, U+600E, U+606F, U+626B, U+63CF, U+6446, U+65C5, U+65E9, U+6625, U+6655, U+665A, U+666E, U+66F2, U+671B, U+671F, U+679A, U+69BB, U+6BCD, U+6C1B, U+6C60, U+6CBB, U+7070, U+77F3, U+7A33, U+7AE0, U+7B26, U+7CCA, U+7EAA, U+7EAF, U+7F29, U+811A, U+8138, U+81F3, U+82F1, U+8303, U+83F2, U+8861, U+8863, U+8865, U+89C8, U+8BCD, U+8BDD, U+8BFA, U+8C22, U+8C61, U+8D1F, U+8D25, U+8D34, U+8D6B, U+8D85, U+8F6F, U+8FBE, U+9001, U+94A5, U+94B1, U+95EE, U+96BE, U+96C0, U+96FE, U+9884, U+9898, U+9E2D, U+9EA6, U+9ECE, U+9ED8; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-5.woff2?v=e3f2ecd5e6") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E18, U+4E30, U+4E49, U+4E8B, U+4ECD, U+4EEA, U+4EF7, U+4F24, U+4F38, U+4F59, U+4F73, U+514D, U+516B, U+5177, U+51DD, U+51EF, U+5305, U+538B, U+53CB, U+53E4, U+53F3, U+5802, U+589E, U+5B54, U+5BA1, U+5BFB, U+5C16, U+5C3A, U+5C81, U+5DE6, U+5DF7, U+5E8A, U+5E95, U+5EB7, U+5F02, U+5F81, U+5FBD, U+5FD7, U+5FE0, U+620F, U+6234, U+6258, U+6293, U+62BD, U+62E9, U+6307, U+6324, U+6491, U+65C1, U+6602, U+660C, U+6613, U+661F, U+6635, U+6670, U+6682, U+670B, U+671D, U+6735, U+6750, U+675C, U+679D, U+67EF, U+67F3, U+682A, U+6839, U+6848, U+6863, U+68F5, U+6B22, U+6B62, U+6C11, U+6D3B, U+6E2F, U+6E56, U+6EE4, U+706B, U+7387, U+7389, U+74DC, U+76D6, U+76D8, U+793E, U+79D1, U+79FB, U+7A0B, U+7A0D, U+7A84, U+7BB1, U+7C7B, U+7C9D, U+7E41, U+7EB8, U+7FE0, U+821E, U+82CF, U+8328, U+83B2, U+83DC, U+8737, U+892A, U+8BC1, U+8BCA, U+8BE6, U+8D26, U+8DDF, U+8F88, U+8FEA, U+900F, U+9690, U+96C4, U+96F7, U+97E6, U+9879, U+987F, U+9C7C, U+9E25-9E26, U+9E42, U+9E64; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-6.woff2?v=ce7950892c") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E14, U+4E4C, U+4E71, U+4EA8, U+4ED3, U+4FBF, U+4FC4, U+4FEE, U+503E, U+515A, U+5178-5179, U+5200, U+521A-521B, U+523A, U+52A9, U+5374, U+5384-5385, U+53E3, U+540A, U+5415, U+542B, U+54E5, U+5854, U+591F, U+5948, U+5976, U+5BC7, U+5C01, U+5C3D-5C3E, U+5C4F, U+5CFB, U+5DDE, U+5DE8, U+5E8F, U+5E93-5E94, U+5EC9-5ECA, U+5F52, U+5F95, U+5FE7, U+6000, U+603B, U+6069, U+6070, U+60A0, U+60AC, U+68C0, U+690D, U+6A31, U+6A58, U+6B65, U+6BEB, U+6C89, U+6CB3, U+6CDB, U+6D88, U+6DE1, U+6EDA, U+6F2B, U+6F6E, U+6FD1, U+71D5, U+72B6, U+732B, U+738B, U+739B, U+73AB, U+73AF, U+73BB, U+7483, U+77AC, U+77E2, U+79C3, U+7A7F, U+7B14, U+7B7E, U+7B97, U+7EC7, U+7EE3, U+7EEA, U+7F18, U+80DC, U+82AC, U+8352, U+83CA, U+8475, U+8587, U+8679, U+89C4, U+8BBA, U+8BEF, U+8F74, U+8F7B, U+8FC8, U+90BB, U+90CA, U+9152, U+9192, U+94C1, U+9614, U+9633, U+9636, U+963F, U+9650, U+9662, U+96C5, U+970D, U+9713, U+9875-9876, U+987A, U+9886, U+9A91, U+9E2F, U+9E33; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-7.woff2?v=f5b671fbd5") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E11, U+4E13, U+4E1A, U+4E3D-4E3E, U+4E5D, U+4E61, U+4E89, U+4E91, U+4E95, U+4EC5, U+4ECB, U+4ED8-4ED9, U+4EF0, U+4EF2, U+4F0D, U+4F9D, U+4FD7, U+4FF1, U+6218, U+6311, U+6377, U+63A7, U+6469, U+653F, U+65D7, U+6643, U+66FC, U+672A, U+6734, U+6742-6743, U+6749, U+67A3, U+67D0, U+67D3, U+67DC, U+6821, U+6897, U+68A6, U+6962, U+697C, U+6982, U+6BB5, U+6C14, U+6C42, U+6CE2, U+6CFD, U+6D17, U+6D6E, U+6E7E-6E7F, U+6F02, U+6F14, U+6F20, U+7261, U+72C2, U+7470, U+751C, U+7532, U+7537, U+76AE, U+76EE, U+775B, U+795E, U+79C1, U+7A00, U+7A81, U+7ACB, U+7B11, U+7EBD, U+7EC3, U+7EC8, U+7EDD, U+7F16, U+7FA4, U+8010, U+8054, U+805A, U+80AF, U+821F, U+8239, U+8273, U+827E, U+8349, U+8499, U+85E9, U+865A, U+8713, U+873B, U+888D, U+8BAE, U+8BBD, U+8BC9, U+8C37, U+8D39, U+8DB3, U+8DC3, U+8F86, U+8FCE, U+8FF0, U+901F, U+90CE, U+91C7, U+9493, U+94A2, U+94F6, U+9632, U+9694, U+96A7, U+9732, U+9988, U+9A6F, U+9E45, U+9E4A, U+9E6D, U+9E70, U+9EBB, U+9EDB; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-8.woff2?v=8fcf5e0790") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+50A8, U+513F, U+515C, U+5171, U+5175, U+526F, U+529F, U+5308, U+5349, U+534E, U+536B, U+5373, U+53A6, U+53C9, U+53CC, U+53D9, U+5438, U+543B, U+5448, U+547C, U+54C0, U+54CD, U+552F, U+5634, U+574F, U+5883, U+58A8, U+58F0, U+59BB, U+5A05, U+5B81, U+5B9C-5B9D, U+5BB3, U+5BBE, U+5BC2, U+5BD2, U+5C06, U+5C0A, U+5C24, U+5C55, U+5C9B, U+5CA9, U+5CB8, U+5CD9, U+5E27, U+5E2E, U+5E7B, U+5E84, U+5E9F, U+5EA7, U+5EAD, U+5F7C, U+5F80, U+5FFD, U+6052, U+60BC, U+60DF, U+6162, U+624E, U+6295, U+6298, U+62A5, U+62D2, U+62D6, U+62E5, U+62F1, U+6302, U+642C-642D, U+654F, U+6551, U+6563, U+6566, U+6599, U+65F7, U+660F, U+66AE, U+66FF, U+6717, U+672F, U+6731, U+674E, U+675F, U+67AA, U+6881, U+68AF, U+68B5, U+68D5, U+695A, U+6BD2, U+6C49, U+6C7D, U+6C83, U+6CBF, U+6CE5, U+6CF0, U+6CFC, U+6D01, U+6D3E, U+6D4F, U+6D69, U+6D82, U+6DE4, U+6DF7, U+6DFB, U+6E0A, U+6EE8, U+6F06, U+6F0F, U+6F88, U+6FB3, U+70AE, U+70ED, U+7236, U+7259, U+725B, U+72D0, U+72F8, U+732A; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-9.woff2?v=cffb549e15") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E34, U+4E50, U+4E60, U+4E7E, U+4EA1, U+4EAC, U+4EE4, U+4F0F, U+4F17, U+4F34, U+4F50, U+4F9B, U+4FA7, U+4FB5, U+4FCF, U+4FEF, U+4FF3, U+501A, U+501F, U+5047, U+508D, U+5141, U+5145, U+5174, U+5192, U+519B, U+51E1, U+51ED, U+51FB, U+5219, U+5237, U+5269, U+52A3, U+52B3, U+52BF, U+52C3, U+52CB, U+52D2, U+5347, U+534F, U+5353, U+5356, U+53BF, U+53D7, U+5413, U+5426, U+542C, U+5435, U+544A, U+5462, U+547D, U+54A7, U+73A9, U+73E0, U+745F, U+752B, U+758F, U+76CF, U+76F2, U+7834, U+7965, U+7968, U+798F, U+79B9, U+79DF, U+7A9C, U+7B51, U+7B56, U+7BA1, U+7BEE, U+7BF1, U+7CD6, U+7D27, U+7EB9, U+7ED8, U+7EDC, U+7EED, U+7F1D, U+7FFB, U+804A, U+817B, U+81C2, U+8212, U+822C, U+826F, U+829D, U+841D, U+8584, U+85B0, U+866B, U+867D, U+86DB, U+8718, U+8725, U+88E4, U+8BAD, U+8BB2, U+8BC6, U+8BE1, U+8C27, U+8DD1, U+8E0F, U+8F6E, U+8F7D, U+8FF7, U+9000, U+9012, U+9047, U+9057, U+949F, U+9521, U+9547, U+95ED, U+964C, U+9676, U+9686, U+9B23, U+9C9C, U+9E23, U+9E3D; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-10.woff2?v=00ca9ecedd") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+54C9, U+5510, U+5524, U+5564, U+5582, U+559D, U+566A, U+56E2, U+56FA, U+5733, U+574A, U+575B, U+5782, U+5821, U+589F, U+58EE, U+5915, U+5939, U+594F, U+5956, U+5996, U+59A5, U+59D1, U+59D3, U+59FB, U+5A18, U+5A5A, U+5A7A, U+5B85, U+5B88, U+5B98, U+5BAB, U+5BB5, U+5BBF, U+5BE5, U+5BF8, U+5BFA, U+5C04, U+5C5E, U+5D0E, U+5D16, U+5DE2, U+5DF3, U+5DFE, U+5E18, U+5E1D, U+5E3D, U+5E55, U+5F15, U+5F18, U+5F1B, U+5F25, U+5F2F, U+5F31, U+5F39, U+5F66, U+5F6D, U+5F77, U+5F84-5F85, U+5F8A-5F8B, U+5F92, U+5F98, U+5FA8, U+5FC5-5FC6, U+5FCD, U+5FD8, U+6005, U+6015, U+6025, U+6062, U+60B2, U+60D8, U+6101, U+613F, U+614E, U+61C2, U+6208, U+621B, U+622A, U+625B, U+6267, U+6269, U+626D, U+6270, U+6279, U+6292, U+62A4, U+62AC, U+62C5-62C6, U+62D0, U+62E6, U+62EC, U+62F3, U+62FC, U+6316, U+6321, U+633A, U+633D, U+63A2, U+63D2, U+63E3, U+63ED, U+6401, U+6447, U+6458, U+6492, U+6512, U+6545, U+655B, U+656C, U+6572, U+658B, U+65BD, U+65CF, U+65FA, U+6606; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-11.woff2?v=9794c39726") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+6620, U+6653, U+6668, U+667A, U+6714, U+6726, U+6751, U+6768, U+676F-6770, U+67AB, U+67CF, U+67F4, U+6808, U+680B, U+6838, U+6842, U+684C, U+6851, U+68A8, U+68AD, U+68B3, U+68DA, U+6984, U+6A44, U+6A71, U+6A90, U+6B20, U+6B32, U+6B4C, U+6B7B, U+6B8B, U+6BD5, U+6BDB, U+6C38, U+6C57, U+6C61, U+6C64, U+6C6A, U+6CE1, U+6D0B, U+6D1E, U+6D25, U+6D2A, U+6D3C, U+6D4E, U+6D78, U+6D9F, U+6DA6, U+6DAF, U+6DB5, U+6DCB, U+6E0D, U+6E14, U+6E32, U+6E34, U+6E85, U+6EA2, U+6ED1, U+6EE9, U+6FEF, U+706D, U+7075, U+70B8, U+70DF, U+70E4, U+70E7, U+7206, U+722A, U+722C, U+723D, U+724C, U+7281, U+72E0, U+730E, U+731B, U+73C0, U+73ED, U+7426, U+7455, U+74F6, U+751A, U+7554, U+7586, U+7591, U+7597, U+75A4, U+75B5, U+75F0, U+76C2, U+7729, U+77B0, U+77DB, U+77E9, U+77F6, U+7802, U+7816, U+788E, U+7891, U+796D, U+79D8, U+79E9, U+79EF, U+7A0E, U+7A20, U+7A46, U+7AA5, U+7AD6, U+7AE5, U+7AF9, U+7B20, U+7B3C, U+7B52, U+7B54, U+7B5B, U+7B71, U+7BC7, U+7CB9, U+7CD5, U+7EA7; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-12.woff2?v=24cbc1a2f7") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+7EB3, U+7ED2, U+7EE7, U+7EF5, U+7EF8, U+7F3A, U+7F8A, U+7FA1, U+7FBD, U+7FC1, U+8015, U+8017, U+8036, U+80A0, U+80E1, U+80E7, U+80F3, U+810F, U+8116, U+8170, U+818A, U+820D, U+8270, U+827A, U+8292, U+82CD, U+82D7, U+82DE, U+82E6, U+8302, U+830E, U+8350, U+8361, U+8363, U+838E, U+83AB, U+8425, U+8427, U+845B, U+84D1, U+85E4, U+86CB, U+871C, U+878D, U+8840, U+8845, U+8869, U+88C2, U+88D4, U+88F8, U+8B66, U+8BB8, U+8BC3, U+8BDA, U+8BDE, U+8BE5, U+8C10, U+8C28, U+8C31, U+8C46, U+8C4C, U+8C6A, U+8D2D, U+8D3A, U+8D44, U+8D5B, U+8D62, U+8DA3, U+8DE8, U+8DEA, U+8E2A, U+8E72, U+8F7C, U+8F85, U+8F91, U+8F93, U+8F9B, U+8F9E, U+8FC5, U+8FFD, U+9006, U+900B, U+9010, U+9014, U+9020, U+9022, U+9038, U+903C, U+904D, U+907F, U+9083, U+90A6, U+90AE, U+91CA, U+94A8, U+94BB, U+94C3, U+94FA, U+950B, U+9519, U+952E, U+9570, U+95F2, U+95FB, U+961F, U+9644-9645, U+9661, U+9669, U+971C, U+97E9, U+97F3, U+987B, U+9890-9891, U+989D, U+98DF, U+9970, U+9A7C, U+9A86; }
@font-face { font-family: "FilmLook Serif"; src: url("/fonts/filmlook-serif-13.woff2?v=6d14d9dc59") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+9AA4, U+9B3C, U+9B54, U+9F3B; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-0.woff2?v=767c33d258") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+20-7E, U+B0-B1, U+B7, U+C9, U+D7, U+E1, U+E3, U+E9, U+ED, U+EF, U+F4, U+F7, U+2013-2014, U+2018-2019, U+201C-201D, U+2026, U+2190-2193, U+2605-2606, U+2661, U+3001-3002, U+300A-3011, U+4E00, U+4E09-4E0B, U+4E0D-4E0E, U+4E24, U+4E2A, U+4E2D, U+4E3A-4E3B, U+4E48, U+4E4B, U+4E5F, U+4E86, U+4EAE, U+4EBA, U+4ECE, U+4EE5, U+4F1A, U+4F4D-4F4E, U+4F60, U+4F8B, U+4FDD, U+504F, U+50CF, U+5149, U+514B, U+518D, U+5199, U+51C6, U+51E0, U+51FA, U+5206, U+5229, U+5230, U+524D, U+52A0, U+52A8, U+5339, U+5361, U+5377, U+53BB, U+53CD, U+53D1, U+53D8, U+53EA, U+53EF-53F0, U+540C-540E, U+548C, U+56FD-56FE, U+5728, U+5730, U+573A, U+578B, U+591A, U+5927, U+5929, U+5934, U+597D, U+5B50, U+5B58, U+5B83, U+5B89, U+5B9E, U+5BC6, U+5BF9, U+5C0F, U+5C14, U+5C31, U+5C42, U+5DEE, U+5DF2, U+5E03, U+5E08, U+5E38, U+5E73-5E74, U+5EA6, U+5F00, U+5F20, U+5F69, U+5F71, U+5F97, U+5FB7, U+6027, U+611F, U+6210, U+6216, U+6240, U+6253, U+628A, U+62C9, U+62CD, U+62DF, U+63A5, U+6444, U+6536, U+6570, U+65AF, U+65B9, U+65E0, U+65E5, U+65F6, U+660E, U+662F, U+666F, U+6696, U+66F4, U+6700, U+6709, U+672C, U+673A, U+6765, U+6790, U+679C, U+67D4, U+6807, U+6837, U+683C, U+6A21, U+6B21, U+6B63, U+6BD4, U+6C34, U+6CA1, U+6CD5, U+6D4B, U+6DF1, U+706F, U+70B9, U+7167, U+7247-7248, U+7279, U+73B0, U+751F, U+7528, U+7535, U+753B, U+767D, U+7684, U+76F8, U+770B, U+7740, U+786E, U+793A, U+79CD, U+7A7A, U+7C92, U+7EA2, U+7EBF, U+7ED3, U+7EFF, U+7F8E, U+80F6, U+80FD, U+81EA, U+8272, U+82B1, U+84DD, U+88AB, U+897F, U+89D2, U+8BC4, U+8BD5, U+8BF4, U+8BF7, U+8C03, U+8D77, U+8F66, U+8FC7, U+8FD1, U+8FD8-8FD9, U+9009, U+9053, U+90A3, U+90FD, U+914D, U+91CC, U+91CF, U+955C, U+95E8, U+95F4, U+9759, U+9762, U+9897, U+989C, U+98CE, U+9971, U+9996, U+9AD8, U+9EC4, U+9ED1, U+FF01, U+FF05, U+FF08-FF09, U+FF0C, U+FF1A-FF1B, U+FF1F, U+FFE5; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-1.woff2?v=bc89756f83") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E8E, U+4E94, U+4E9A, U+4EC0, U+4ED6, U+4EE3, U+4EF6, U+4F3C, U+4F53, U+4F55, U+4F5C, U+4FE1, U+5165, U+5168, U+5170, U+5176, U+5185, U+51B7, U+5224, U+5316, U+5341, U+534A, U+539F, U+53C2, U+5404, U+5408, U+5411, U+54C1, U+54EA, U+56DE, U+56E0, U+56F4, U+5708, U+5747, U+57FA, U+5904, U+591C, U+592A, U+5B66, U+5B8C, U+5B9A, U+5BB6, U+5C11, U+5E26, U+5E76, U+5F0F, U+5F88, U+5FEB, U+6211, U+624B, U+6362, U+636E, U+6539, U+6548, U+6574, U+6587, U+65AD, U+65B0, U+663E, U+6697, U+6708, U+670D, U+6761, U+6784, U+6A59, U+6BCF, U+6D77, U+6E05, U+7126, U+7269, U+7406, U+7530, U+7559, U+7565, U+767E, U+76F4, U+771F, U+773C, U+7801, U+79BB, U+7A97, U+7B2C, U+7B49, U+7EA6, U+7EC6, U+7ECF, U+7ED9, U+7EF4, U+7F57, U+7F6E, U+8005, U+800C, U+80A4, U+83B1, U+85CF, U+884C, U+8857, U+8868, U+8981, U+89C1-89C2, U+89C6, U+89C9, U+8A00, U+8BA9, U+8BB0, U+8BED, U+8BFB, U+8D70, U+8FB9, U+8FDB, U+9002, U+90E8, U+91CD, U+91D1, U+957F, U+95EA, U+9634, U+9752, U+9E1F; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-2.woff2?v=0191ae1013") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E1C, U+4E45, U+4E4E, U+4E66, U+4E8C, U+4E9B, U+4EAB, U+4EB2, U+4EEC, U+4F20, U+4F2F-4F30, U+4F46, U+503C, U+505A, U+505C, U+5148, U+5173, U+518C, U+51B2, U+522B, U+523B, U+52A1, U+533A, U+5355, U+5357, U+5360, U+53C8, U+53D6, U+53E5, U+5409, U+5546, U+559C, U+5706, U+5750, U+5757, U+5858, U+58EB, U+5907, U+590D, U+5916, U+5982, U+5B57, U+5BB9, U+5BCC, U+5C45, U+5C71, U+5DDD, U+5DF1, U+5DF4, U+5E45, U+5E72, U+5F3A, U+5F53, U+5F55, U+5F62, U+5FC3, U+60C5, U+624D, U+62FF, U+6301, U+6309, U+6392, U+652F, U+653E, U+66DD, U+6781, U+67B6, U+67E5, U+6811, U+6846, U+68EE, U+6CB9, U+6D53, U+6E21, U+6E29, U+6EE1, U+70C8, U+72D7, U+72EC, U+767B, U+7761, U+79F0, U+7AD9, U+7AEF, U+7B80, U+7C73, U+7C89, U+7C97, U+7D20, U+7D22, U+7D2B, U+7F13, U+8003, U+8096, U+80CC, U+8111, U+81F4, U+8377, U+843D, U+8482, U+89E3, U+8BA1, U+8BBE, U+8BFE, U+8C01, U+8D28, U+8D8A, U+8F6C, U+8F83, U+8FDC, U+901A, U+964D, U+96C6, U+96E8, U+975E, U+9999, U+9A6C, U+9A8C, U+9C81; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-3.woff2?v=958d6efdf6") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E01, U+4E07, U+4E16, U+4E39, U+4E92, U+4EFB, U+4EFD, U+4F1E, U+4F26, U+5019, U+5143, U+516C, U+51C0, U+5220, U+5236, U+5267, U+5343, U+5382, U+5386, U+53E0, U+53EB, U+53F2, U+5427, U+54C8, U+5668, U+56DB, U+56ED, U+57C3, U+57CE, U+585E, U+586B, U+592B, U+5931, U+5947, U+5957, U+5965, U+59C6, U+59CB, U+5A01, U+5B64, U+5BBD, U+5BFC, U+5C3C, U+5DE5, U+5E02, U+5E15, U+5E7F, U+5EFA, U+5F17, U+6001, U+60F3, U+610F, U+6237, U+623F, U+6247, U+627E, U+6389, U+63A8, U+63D0, U+659C, U+65E7, U+6728, U+677E-677F, U+6797, U+6843, U+6865, U+6885, U+6A2A, U+6B3E, U+6B64, U+6C5F, U+6C99, U+6CE8, U+6D1B, U+6D41, U+6D45, U+6D6A, U+6E38, U+6E90, U+7136, U+7231, U+7403, U+745E, U+74E6, U+7531, U+754C, U+75D5, U+77E5, U+786C, U+79D2, U+7CBE, U+7CFB, U+7EC4, U+7EDF, U+7F51, U+8001, U+8282, U+8428, U+88C5, U+8BA4, U+8BD7, U+8DDD, U+8DEF, U+8DF3, U+8EAB, U+8FD0, U+8FDE, U+8FF9, U+90C1, U+91CE, U+9501, U+9510, U+9664, U+968F, U+96EA, U+9700, U+9760, U+98DE, U+9986; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-4.woff2?v=94e31434f3") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E03, U+4E1D, U+4E25, U+4E54, U+4E70, U+4EA4, U+4EA7, U+4ECA, U+4F0A, U+4F4F, U+4F7F, U+5012, U+516D, U+517B, U+51AC, U+51B0, U+51B3, U+5207, U+5217-5218, U+526A, U+529B, U+5300, U+5317, U+5348, U+535A, U+5370, U+53CA, U+53E6, U+53F6-53F8, U+5417, U+5458, U+5468, U+5473, U+571F, U+5723, U+5766, U+57DF, U+5899, U+590F, U+5973, U+5979, U+5B63, U+5B69, U+5BA2, U+5BA4, U+5BDF, U+5C40, U+5C4B, U+5E0C, U+5E7D, U+5E97, U+5FAE, U+5FF5, U+600E, U+606F, U+626B, U+63CF, U+6446, U+65C5, U+65E9, U+6625, U+6655, U+665A, U+666E, U+66F2, U+671B, U+671F, U+679A, U+69BB, U+6BCD, U+6C1B, U+6C60, U+6CBB, U+7070, U+77F3, U+7A33, U+7AE0, U+7B26, U+7CCA, U+7EAA, U+7EAF, U+7F29, U+811A, U+8138, U+81F3, U+82F1, U+8303, U+83F2, U+8861, U+8863, U+8865, U+89C8, U+8BCD, U+8BDD, U+8BFA, U+8C22, U+8C61, U+8D1F, U+8D25, U+8D34, U+8D6B, U+8D85, U+8F6F, U+8FBE, U+9001, U+94A5, U+94B1, U+95EE, U+96BE, U+96C0, U+96FE, U+9884, U+9898, U+9E2D, U+9EA6, U+9ECE, U+9ED8; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-5.woff2?v=72b776529d") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E18, U+4E30, U+4E49, U+4E8B, U+4ECD, U+4EEA, U+4EF7, U+4F24, U+4F38, U+4F59, U+4F73, U+514D, U+516B, U+5177, U+51DD, U+51EF, U+5305, U+538B, U+53CB, U+53E4, U+53F3, U+5802, U+589E, U+5B54, U+5BA1, U+5BFB, U+5C16, U+5C3A, U+5C81, U+5DE6, U+5DF7, U+5E8A, U+5E95, U+5EB7, U+5F02, U+5F81, U+5FBD, U+5FD7, U+5FE0, U+620F, U+6234, U+6258, U+6293, U+62BD, U+62E9, U+6307, U+6324, U+6491, U+65C1, U+6602, U+660C, U+6613, U+661F, U+6635, U+6670, U+6682, U+670B, U+671D, U+6735, U+6750, U+675C, U+679D, U+67EF, U+67F3, U+682A, U+6839, U+6848, U+6863, U+68F5, U+6B22, U+6B62, U+6C11, U+6D3B, U+6E2F, U+6E56, U+6EE4, U+706B, U+7387, U+7389, U+74DC, U+76D6, U+76D8, U+793E, U+79D1, U+79FB, U+7A0B, U+7A0D, U+7A84, U+7BB1, U+7C7B, U+7C9D, U+7E41, U+7EB8, U+7FE0, U+821E, U+82CF, U+8328, U+83B2, U+83DC, U+8737, U+892A, U+8BC1, U+8BCA, U+8BE6, U+8D26, U+8DDF, U+8F88, U+8FEA, U+900F, U+9690, U+96C4, U+96F7, U+97E6, U+9879, U+987F, U+9C7C, U+9E25-9E26, U+9E42, U+9E64; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-6.woff2?v=ea66dce9cc") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E14, U+4E4C, U+4E71, U+4EA8, U+4ED3, U+4FBF, U+4FC4, U+4FEE, U+503E, U+515A, U+5178-5179, U+5200, U+521A-521B, U+523A, U+52A9, U+5374, U+5384-5385, U+53E3, U+540A, U+5415, U+542B, U+54E5, U+5854, U+591F, U+5948, U+5976, U+5BC7, U+5C01, U+5C3D-5C3E, U+5C4F, U+5CFB, U+5DDE, U+5DE8, U+5E8F, U+5E93-5E94, U+5EC9-5ECA, U+5F52, U+5F95, U+5FE7, U+6000, U+603B, U+6069, U+6070, U+60A0, U+60AC, U+68C0, U+690D, U+6A31, U+6A58, U+6B65, U+6BEB, U+6C89, U+6CB3, U+6CDB, U+6D88, U+6DE1, U+6EDA, U+6F2B, U+6F6E, U+6FD1, U+71D5, U+72B6, U+732B, U+738B, U+739B, U+73AB, U+73AF, U+73BB, U+7483, U+77AC, U+77E2, U+79C3, U+7A7F, U+7B14, U+7B7E, U+7B97, U+7EC7, U+7EE3, U+7EEA, U+7F18, U+80DC, U+82AC, U+8352, U+83CA, U+8475, U+8587, U+8679, U+89C4, U+8BBA, U+8BEF, U+8F74, U+8F7B, U+8FC8, U+90BB, U+90CA, U+9152, U+9192, U+94C1, U+9614, U+9633, U+9636, U+963F, U+9650, U+9662, U+96C5, U+970D, U+9713, U+9875-9876, U+987A, U+9886, U+9A91, U+9E2F, U+9E33; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-7.woff2?v=8586acbf66") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E11, U+4E13, U+4E1A, U+4E3D-4E3E, U+4E5D, U+4E61, U+4E89, U+4E91, U+4E95, U+4EC5, U+4ECB, U+4ED8-4ED9, U+4EF0, U+4EF2, U+4F0D, U+4F9D, U+4FD7, U+4FF1, U+6218, U+6311, U+6377, U+63A7, U+6469, U+653F, U+65D7, U+6643, U+66FC, U+672A, U+6734, U+6742-6743, U+6749, U+67A3, U+67D0, U+67D3, U+67DC, U+6821, U+6897, U+68A6, U+6962, U+697C, U+6982, U+6BB5, U+6C14, U+6C42, U+6CE2, U+6CFD, U+6D17, U+6D6E, U+6E7E-6E7F, U+6F02, U+6F14, U+6F20, U+7261, U+72C2, U+7470, U+751C, U+7532, U+7537, U+76AE, U+76EE, U+775B, U+795E, U+79C1, U+7A00, U+7A81, U+7ACB, U+7B11, U+7EBD, U+7EC3, U+7EC8, U+7EDD, U+7F16, U+7FA4, U+8010, U+8054, U+805A, U+80AF, U+821F, U+8239, U+8273, U+827E, U+8349, U+8499, U+85E9, U+865A, U+8713, U+873B, U+888D, U+8BAE, U+8BBD, U+8BC9, U+8C37, U+8D39, U+8DB3, U+8DC3, U+8F86, U+8FCE, U+8FF0, U+901F, U+90CE, U+91C7, U+9493, U+94A2, U+94F6, U+9632, U+9694, U+96A7, U+9732, U+9988, U+9A6F, U+9E45, U+9E4A, U+9E6D, U+9E70, U+9EBB, U+9EDB; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-8.woff2?v=5aa9fc634b") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+50A8, U+513F, U+515C, U+5171, U+5175, U+526F, U+529F, U+5308, U+5349, U+534E, U+536B, U+5373, U+53A6, U+53C9, U+53CC, U+53D9, U+5438, U+543B, U+5448, U+547C, U+54C0, U+54CD, U+552F, U+5634, U+574F, U+5883, U+58A8, U+58F0, U+59BB, U+5A05, U+5B81, U+5B9C-5B9D, U+5BB3, U+5BBE, U+5BC2, U+5BD2, U+5C06, U+5C0A, U+5C24, U+5C55, U+5C9B, U+5CA9, U+5CB8, U+5CD9, U+5E27, U+5E2E, U+5E7B, U+5E84, U+5E9F, U+5EA7, U+5EAD, U+5F7C, U+5F80, U+5FFD, U+6052, U+60BC, U+60DF, U+6162, U+624E, U+6295, U+6298, U+62A5, U+62D2, U+62D6, U+62E5, U+62F1, U+6302, U+642C-642D, U+654F, U+6551, U+6563, U+6566, U+6599, U+65F7, U+660F, U+66AE, U+66FF, U+6717, U+672F, U+6731, U+674E, U+675F, U+67AA, U+6881, U+68AF, U+68B5, U+68D5, U+695A, U+6BD2, U+6C49, U+6C7D, U+6C83, U+6CBF, U+6CE5, U+6CF0, U+6CFC, U+6D01, U+6D3E, U+6D4F, U+6D69, U+6D82, U+6DE4, U+6DF7, U+6DFB, U+6E0A, U+6EE8, U+6F06, U+6F0F, U+6F88, U+6FB3, U+70AE, U+70ED, U+7236, U+7259, U+725B, U+72D0, U+72F8, U+732A; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-9.woff2?v=c9ec5b6db5") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+4E34, U+4E50, U+4E60, U+4E7E, U+4EA1, U+4EAC, U+4EE4, U+4F0F, U+4F17, U+4F34, U+4F50, U+4F9B, U+4FA7, U+4FB5, U+4FCF, U+4FEF, U+4FF3, U+501A, U+501F, U+5047, U+508D, U+5141, U+5145, U+5174, U+5192, U+519B, U+51E1, U+51ED, U+51FB, U+5219, U+5237, U+5269, U+52A3, U+52B3, U+52BF, U+52C3, U+52CB, U+52D2, U+5347, U+534F, U+5353, U+5356, U+53BF, U+53D7, U+5413, U+5426, U+542C, U+5435, U+544A, U+5462, U+547D, U+54A7, U+73A9, U+73E0, U+745F, U+752B, U+758F, U+76CF, U+76F2, U+7834, U+7965, U+7968, U+798F, U+79B9, U+79DF, U+7A9C, U+7B51, U+7B56, U+7BA1, U+7BEE, U+7BF1, U+7CD6, U+7D27, U+7EB9, U+7ED8, U+7EDC, U+7EED, U+7F1D, U+7FFB, U+804A, U+817B, U+81C2, U+8212, U+822C, U+826F, U+829D, U+841D, U+8584, U+85B0, U+866B, U+867D, U+86DB, U+8718, U+8725, U+88E4, U+8BAD, U+8BB2, U+8BC6, U+8BE1, U+8C27, U+8DD1, U+8E0F, U+8F6E, U+8F7D, U+8FF7, U+9000, U+9012, U+9047, U+9057, U+949F, U+9521, U+9547, U+95ED, U+964C, U+9676, U+9686, U+9B23, U+9C9C, U+9E23, U+9E3D; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-10.woff2?v=55aa3bf210") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+54C9, U+5510, U+5524, U+5564, U+5582, U+559D, U+566A, U+56E2, U+56FA, U+5733, U+574A, U+575B, U+5782, U+5821, U+589F, U+58EE, U+5915, U+5939, U+594F, U+5956, U+5996, U+59A5, U+59D1, U+59D3, U+59FB, U+5A18, U+5A5A, U+5A7A, U+5B85, U+5B88, U+5B98, U+5BAB, U+5BB5, U+5BBF, U+5BE5, U+5BF8, U+5BFA, U+5C04, U+5C5E, U+5D0E, U+5D16, U+5DE2, U+5DF3, U+5DFE, U+5E18, U+5E1D, U+5E3D, U+5E55, U+5F15, U+5F18, U+5F1B, U+5F25, U+5F2F, U+5F31, U+5F39, U+5F66, U+5F6D, U+5F77, U+5F84-5F85, U+5F8A-5F8B, U+5F92, U+5F98, U+5FA8, U+5FC5-5FC6, U+5FCD, U+5FD8, U+6005, U+6015, U+6025, U+6062, U+60B2, U+60D8, U+6101, U+613F, U+614E, U+61C2, U+6208, U+621B, U+622A, U+625B, U+6267, U+6269, U+626D, U+6270, U+6279, U+6292, U+62A4, U+62AC, U+62C5-62C6, U+62D0, U+62E6, U+62EC, U+62F3, U+62FC, U+6316, U+6321, U+633A, U+633D, U+63A2, U+63D2, U+63E3, U+63ED, U+6401, U+6447, U+6458, U+6492, U+6512, U+6545, U+655B, U+656C, U+6572, U+658B, U+65BD, U+65CF, U+65FA, U+6606; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-11.woff2?v=8b4b6235c5") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+6620, U+6653, U+6668, U+667A, U+6714, U+6726, U+6751, U+6768, U+676F-6770, U+67AB, U+67CF, U+67F4, U+6808, U+680B, U+6838, U+6842, U+684C, U+6851, U+68A8, U+68AD, U+68B3, U+68DA, U+6984, U+6A44, U+6A71, U+6A90, U+6B20, U+6B32, U+6B4C, U+6B7B, U+6B8B, U+6BD5, U+6BDB, U+6C38, U+6C57, U+6C61, U+6C64, U+6C6A, U+6CE1, U+6D0B, U+6D1E, U+6D25, U+6D2A, U+6D3C, U+6D4E, U+6D78, U+6D9F, U+6DA6, U+6DAF, U+6DB5, U+6DCB, U+6E0D, U+6E14, U+6E32, U+6E34, U+6E85, U+6EA2, U+6ED1, U+6EE9, U+6FEF, U+706D, U+7075, U+70B8, U+70DF, U+70E4, U+70E7, U+7206, U+722A, U+722C, U+723D, U+724C, U+7281, U+72E0, U+730E, U+731B, U+73C0, U+73ED, U+7426, U+7455, U+74F6, U+751A, U+7554, U+7586, U+7591, U+7597, U+75A4, U+75B5, U+75F0, U+76C2, U+7729, U+77B0, U+77DB, U+77E9, U+77F6, U+7802, U+7816, U+788E, U+7891, U+796D, U+79D8, U+79E9, U+79EF, U+7A0E, U+7A20, U+7A46, U+7AA5, U+7AD6, U+7AE5, U+7AF9, U+7B20, U+7B3C, U+7B52, U+7B54, U+7B5B, U+7B71, U+7BC7, U+7CB9, U+7CD5, U+7EA7; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-12.woff2?v=021c9811ed") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+7EB3, U+7ED2, U+7EE7, U+7EF5, U+7EF8, U+7F3A, U+7F8A, U+7FA1, U+7FBD, U+7FC1, U+8015, U+8017, U+8036, U+80A0, U+80E1, U+80E7, U+80F3, U+810F, U+8116, U+8170, U+818A, U+820D, U+8270, U+827A, U+8292, U+82CD, U+82D7, U+82DE, U+82E6, U+8302, U+830E, U+8350, U+8361, U+8363, U+838E, U+83AB, U+8425, U+8427, U+845B, U+84D1, U+85E4, U+86CB, U+871C, U+878D, U+8840, U+8845, U+8869, U+88C2, U+88D4, U+88F8, U+8B66, U+8BB8, U+8BC3, U+8BDA, U+8BDE, U+8BE5, U+8C10, U+8C28, U+8C31, U+8C46, U+8C4C, U+8C6A, U+8D2D, U+8D3A, U+8D44, U+8D5B, U+8D62, U+8DA3, U+8DE8, U+8DEA, U+8E2A, U+8E72, U+8F7C, U+8F85, U+8F91, U+8F93, U+8F9B, U+8F9E, U+8FC5, U+8FFD, U+9006, U+900B, U+9010, U+9014, U+9020, U+9022, U+9038, U+903C, U+904D, U+907F, U+9083, U+90A6, U+90AE, U+91CA, U+94A8, U+94BB, U+94C3, U+94FA, U+950B, U+9519, U+952E, U+9570, U+95F2, U+95FB, U+961F, U+9644-9645, U+9661, U+9669, U+971C, U+97E9, U+97F3, U+987B, U+9890-9891, U+989D, U+98DF, U+9970, U+9A7C, U+9A86; }
@font-face { font-family: "FilmLook Rounded"; src: url("/fonts/filmlook-rounded-13.woff2?v=a290f436c1") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+9AA4, U+9B3C, U+9B54, U+9F3B; }
/* fonts:end */

:root {
  --bg: #FBF8F5; --surface: #F4ECE8; --text: #3F3A3B; --text2: #7A6F72; --accent: #9A5F66;
  --on-accent: #FFF9F7; --ink: #34504B; --divider: #E8DFDB; --matcha: #647761;
  --round: "FilmLook Rounded", ui-rounded, "SF Pro Rounded", "Arial Rounded MT Bold", -apple-system, "PingFang SC", "Noto Sans CJK SC", sans-serif;
  /* Chinese serif faces first. Hiragino Mincho and Yu Mincho are Japanese and lack many simplified
     glyphs, so a line set in them falls back character by character and looks uneven. */
  /* Latin faces first, Chinese after: the browser picks a font per character, so Latin letters
     and digits come from Georgia and every Chinese character from one Chinese face. iPhones ship
     no Chinese serif, so the list ends in the system Chinese sans (PingFang on iOS, Noto Sans CJK
     on Android) rather than the generic serif, which iOS resolves glyph by glyph. */
  --serif: Georgia, "FilmLook Serif", "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", -apple-system, "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
  --zh-sans: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;
  --gutter: clamp(16px, 4vw, 40px);
  --column: 40rem;  /* The widest the reading column gets; narrower screens use their full width. */
  --radius: 1.4rem;
  font-size: clamp(15px, 0.45vw + 13.4px, 18px);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; font-synthesis: none; }
body { margin: 0; background: var(--bg); color: var(--text); line-height: 1.55;
       font-family: var(--zh-sans);
       padding: 0 var(--gutter) calc(1.5rem + env(safe-area-inset-bottom)); }
#app, .top, .foot { width: 100%; max-width: var(--column); margin-inline: auto; min-width: 0; }
.round { font-family: var(--round); font-weight: 500; font-synthesis: none; }
.serif { font-family: var(--serif); font-weight: 400; }
h1, h2, h3, p { margin: 0; }
button, label.cta, label.ghost { font: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; }
button:focus-visible, label:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
[hidden] { display: none !important; }
img, svg { max-width: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

.top { display: flex; align-items: center; justify-content: space-between; padding: clamp(10px, 2vw, 18px) 0 .4rem; }
.wordmark { display: flex; align-items: center; gap: .5rem; color: var(--ink); font-family: var(--round); font-weight: 700; letter-spacing: .06em; font-size: 1.05rem; }
.mascot svg { width: 1.9rem; height: 1.9rem; display: block; }
.switches { display: flex; gap: .35rem; flex-shrink: 0; }
.lang { border: 1px solid var(--divider); background: transparent; color: var(--text2); border-radius: 999px; padding: .3rem .7rem; font-size: .82rem; min-height: 2.2rem; white-space: nowrap; }

.hero { padding-top: .9rem; }
/* The width is in em, not ch: ch is the width of "0", half a Chinese character, so 16ch held only
   eight or nine characters and pushed the last one of 发现你的摄影风格基因 onto its own line. */
.hero h1 { font-size: clamp(1.6rem, .9rem + 3.4vw, 2.5rem); line-height: 1.2; color: var(--ink); margin-bottom: .6rem; max-width: 12em; text-wrap: balance; overflow-wrap: anywhere; }
.sub { font-size: 1rem; color: var(--text2); margin: 0 0 .9rem; max-width: 34rem; }
.pills { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.1rem; }
.pill { font-size: .78rem; letter-spacing: .04em; padding: .32rem .8rem; border-radius: 999px; background: var(--surface); color: var(--accent); }
.cta, .primary { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 3.2rem; padding: .85rem 1.2rem; border-radius: 999px;
                 background: var(--accent); color: var(--on-accent); border: 0; font-size: 1.05rem; }
.primary:disabled { opacity: .6; cursor: progress; }
.ghost { display: flex; align-items: center; justify-content: center; min-height: 3rem; padding: .7rem 1.2rem; border-radius: 999px; border: 1px solid var(--divider); color: var(--text2); font-size: .95rem; background: transparent; }
.plate { display: flex; justify-content: center; margin: 1.4rem 0 .6rem; }
.plate svg { width: clamp(220px, 62vw, 420px); height: auto; }
.steps { padding: 0 0 0 1.1rem; margin: .4rem 0 .6rem; color: var(--text2); font-size: .9rem; max-width: 34rem; }
.steps li { margin-bottom: .25rem; }
.privacy, .note { font-size: .8rem; color: var(--text2); line-height: 1.5; max-width: 36rem; }

.photo-section { padding-top: .6rem; }
.preview { width: 100%; max-height: 70vh; object-fit: contain; height: auto; border-radius: var(--radius); display: block; margin-bottom: .9rem; background: var(--surface); }
.row { display: flex; gap: .6rem; align-items: stretch; }
.row .primary { flex: 1; }
.status { font-size: .9rem; color: var(--accent); min-height: 1.4em; margin: .5rem 0 0; }

.ornament { display: flex; justify-content: center; align-items: center; gap: .9rem; margin: 1.6rem 0 1.1rem; }
.ornament svg { width: 1.6rem; height: 1.6rem; }
.ornament::before, .ornament::after { content: ""; flex: 1; max-width: 5rem; height: 1px; background: var(--divider); }

.result-card { background: var(--surface); border-radius: var(--radius); padding: 1.4rem 1.25rem 1.1rem; }
.kicker { font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.kicker.zh { letter-spacing: .04em; }
.lead { color: var(--text2); margin: .5rem 0 .1rem; font-size: .95rem; }
.name { font-family: var(--serif); font-weight: 400; font-size: clamp(2rem, 1.2rem + 3.6vw, 2.9rem); line-height: 1.12; color: var(--ink); overflow-wrap: anywhere; }
.other { color: var(--text2); font-size: .95rem; margin: .15rem 0 .9rem; }
.sim { display: flex; align-items: center; gap: .75rem; margin-bottom: .9rem; }
.seal { width: 4.2rem; height: 4.2rem; border-radius: 50%; border: 1.5px solid var(--accent); display: flex; align-items: center; justify-content: center;
        font-family: var(--serif); font-size: 1.3rem; color: var(--ink); flex-shrink: 0; }
.sim-words { color: var(--text2); font-size: .95rem; }
.keywords { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .9rem; }
.keyword { font-size: .8rem; letter-spacing: .04em; padding: .3rem .7rem; border-radius: 999px; border: 1px solid var(--divider); color: var(--accent); }
.quote { font-family: var(--serif); font-size: clamp(1.05rem, .9rem + .6vw, 1.25rem); line-height: 1.6; margin: 0 0 .4rem; }
.badge { display: inline-block; font-size: .72rem; color: var(--text2); border: 1px solid var(--divider); border-radius: 999px; padding: .12rem .6rem; margin-top: .5rem; }
.small { font-size: .8rem; color: var(--text2); line-height: 1.5; margin: .6rem 0 0; }
.loose { font-size: .85rem; color: var(--accent); margin: .5rem 0 0; }

h2.section { font-family: var(--round); font-size: 1.2rem; color: var(--ink); margin: 0 0 .6rem; }
.alts { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .6rem; }
.alt { border: 1px solid var(--divider); border-radius: 1.1rem; padding: .9rem .85rem; background: var(--bg); }
.alt .name { font-size: 1.3rem; }
.alt .sim-words { font-size: .82rem; margin: .1rem 0 .4rem; }
.alt .keywords { gap: .25rem; margin-bottom: .5rem; }
.alt .keyword { font-size: .7rem; padding: .2rem .5rem; }
.alt p { font-size: .85rem; color: var(--text); margin: 0; line-height: 1.5; }

details { border: 1px solid var(--divider); border-radius: 1.1rem; padding: .75rem 1rem; margin-top: .9rem; background: var(--bg); }
summary { font-family: var(--round); font-weight: 700; color: var(--ink); cursor: pointer; min-height: 2rem; display: flex; align-items: center; }
details h3 { font-size: .9rem; color: var(--accent); margin: .9rem 0 .35rem; letter-spacing: .02em; }
details ul { padding-left: 1.1rem; margin: 0; font-size: .9rem; }
details li { margin-bottom: .25rem; }
details p { font-size: .9rem; margin: .25rem 0; }

.card-grid { display: grid; grid-template-columns: 1fr; gap: .9rem; align-items: start; }
.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: .4rem 0 .6rem; }
.chip { border: 1px solid var(--divider); background: transparent; color: var(--text2); border-radius: 999px; padding: .45rem .9rem; font-size: .88rem; min-height: 2.3rem; }
.chip.on { background: var(--ink); color: var(--bg); border-color: var(--ink); }
#card-box { max-width: 26rem; width: 100%; margin-inline: auto; }
.card-preview { width: 100%; height: auto; border-radius: 1.1rem; display: block; box-shadow: 0 .6rem 1.8rem rgba(0,0,0,.08); }
.card-wait { border-radius: 1.1rem; background: var(--surface); aspect-ratio: 3/4; display: flex; align-items: center; justify-content: center; color: var(--text2); padding: 1rem; text-align: center; }
.actions { display: flex; gap: .6rem; margin-top: .75rem; }
.actions > * { flex: 1; }
.secondary { min-height: 3rem; padding: .7rem 1.2rem; border-radius: 999px; border: 1px solid var(--accent); color: var(--accent); background: transparent; font-size: 1rem; }
.secondary:disabled { opacity: .6; }
.hint { font-size: .85rem; color: var(--text2); margin-top: .5rem; }

.film .score { font-family: var(--serif); font-size: clamp(2.8rem, 2rem + 3vw, 3.6rem); line-height: 1; color: var(--ink); }
.film .score span { font-size: 1.1rem; color: var(--text2); margin-left: .4rem; }
.film .dims { margin: .75rem 0 .5rem; }
.film h3 { font-size: .9rem; color: var(--accent); margin: 1rem 0 .35rem; letter-spacing: .02em; }
.film h4 { font-size: .9rem; color: var(--ink); margin: .9rem 0 .3rem; font-family: var(--round); }
.film ul { padding-left: 1.1rem; font-size: .9rem; }
.film p { font-size: .92rem; margin: .3rem 0; }
.film .mini { font-size: .78rem; color: var(--text2); line-height: 1.5; margin: .35rem 0; }
.film .target { font-family: var(--serif); font-size: 1.5rem; color: var(--ink); margin: .1rem 0 .6rem; }
.film .match, .film .cand { border-top: 1px dashed var(--divider); padding-top: .5rem; margin-top: .5rem; }
.film .cand-head { display: flex; justify-content: space-between; align-items: baseline; gap: .6rem; }

/* Measured data: bars, tables and the inline SVG charts, all in the page's own tokens. */
.bars { display: grid; gap: .35rem; margin: .4rem 0 .6rem; }
.bar-row { display: grid; grid-template-columns: minmax(5.5rem, 9rem) 1fr 2.6rem; align-items: center; gap: .5rem; font-size: .82rem; }
.bar-row .bar-label { color: var(--text2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-row .bar-label:empty { display: none; }
.bar-row:has(.bar-label:empty) { grid-template-columns: 1fr 2.6rem; }
.bar-track { height: .55rem; background: var(--divider); border-radius: 999px; overflow: hidden; }
.bar-fill { display: block; height: 100%; background: var(--ink); border-radius: 999px; }
.bar-value { text-align: right; font-variant-numeric: tabular-nums; color: var(--text); }
.bar-value:empty { display: none; }
.tbl-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: .4rem 0 .6rem; }
table.data { border-collapse: collapse; width: 100%; font-size: .8rem; font-variant-numeric: tabular-nums; }
table.data th, table.data td { text-align: right; padding: .35rem .4rem; border-bottom: 1px solid var(--divider); vertical-align: top; }
table.data td { white-space: nowrap; }
table.data th { font-size: .74rem; line-height: 1.3; }
table.data th { color: var(--text2); font-weight: 500; }
table.data td.lbl, table.data th:first-child { text-align: left; color: var(--text2); }
.chart { margin: .6rem 0 .4rem; }
.chart svg { width: 100%; height: 7rem; display: block; }
.chart .legend { display: flex; flex-wrap: wrap; gap: .3rem .9rem; font-size: .76rem; color: var(--text2); margin-bottom: .25rem; }
.chart .legend i { display: inline-block; width: .7rem; height: .7rem; border-radius: 50%; margin-right: .3rem; vertical-align: -.05rem; }
.chart .axis-labels { display: flex; justify-content: space-between; font-size: .72rem; color: var(--text2); margin-top: .15rem; }
.grid { stroke: var(--divider); fill: none; stroke-width: 1; vector-effect: non-scaling-stroke; }
.scope-box, .ab-box { display: flex; justify-content: center; margin: .6rem 0; }
svg.scope { width: min(100%, 22rem); height: auto; }
svg.ab { width: min(100%, 24rem); height: auto; }
svg .dot { stroke: var(--divider); stroke-width: .3; }
svg .shape { fill: none; stroke: var(--text); stroke-width: 1.2; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
svg .label { fill: var(--text); font-size: 11px; font-weight: 600; font-family: var(--round); }
svg .axis-title { fill: var(--text2); font-size: 6px; }
svg .move { stroke: var(--text); stroke-width: .6; }
svg .ref { fill: none; stroke: var(--text); stroke-width: .8; }
svg .moved { fill: var(--text); stroke: var(--surface); stroke-width: .8; }
.readouts { display: grid; grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr)); gap: .5rem; margin: .4rem 0 .6rem; }
.readouts div { background: var(--bg); border: 1px solid var(--divider); border-radius: .9rem; padding: .5rem .7rem; display: flex; flex-direction: column; }
.readouts span { font-size: .72rem; color: var(--text2); }
.readouts b { font-weight: 500; font-size: 1.05rem; color: var(--ink); }
.recipe { display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); column-gap: 1.75rem; row-gap: .15rem; margin: .4rem 0; }
.recipe div { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; border-bottom: 1px dashed var(--divider); padding: .3rem 0; font-size: .85rem; }
.recipe b { font-weight: 500; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.film details.flat { border: 0; padding: 0; margin-top: .3rem; background: transparent; }
.film details.flat summary { font-size: .82rem; font-weight: 500; color: var(--text2); min-height: 1.6rem; }

.rating .scale { display: flex; gap: .5rem; margin: .4rem 0 .75rem; }
.rating .scale button { flex: 1; border: 1px solid var(--divider); background: transparent; border-radius: .8rem; min-height: 2.8rem; font-size: 1rem; color: var(--text2); }
.rating .scale button.on { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.rating .best { display: flex; flex-wrap: wrap; gap: .5rem; margin: .4rem 0 .75rem; }
.rating .label { margin: .4rem 0 .1rem; font-size: .9rem; }
.rating textarea { width: 100%; border: 1px solid var(--divider); border-radius: .9rem; padding: .6rem .8rem; font: inherit; background: var(--bg); color: var(--text); resize: vertical; min-height: 4rem; }
.foot { text-align: center; font-size: .78rem; color: var(--text2); padding: 2rem 0 .6rem; }

/* Tablets and laptops: a wider column, the card controls beside the preview. */
@media (min-width: 760px) {
  :root { --column: 46rem; }
  .card-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .card-grid .card-controls { order: 1; }
  .card-grid #card-box { order: 2; }
  .alts { gap: .9rem; }
}
/* Large screens: the column stops growing, so lines never get too long to read. */
@media (min-width: 1200px) {
  :root { --column: 50rem; }
}
/* Short landscape phones: keep the illustration from pushing the upload button away. */
@media (max-height: 520px) and (orientation: landscape) {
  .plate svg { width: clamp(140px, 30vh, 240px); }
}

/* ---- Feedback sheet, badge reveal and the collection ---- */
.icon-btn { padding: .3rem .55rem; display: flex; align-items: center; }
.icon-btn svg { width: 1.3rem; height: 1.3rem; display: block; }
.icon-btn .count { font-size: .72rem; margin-left: .3rem; color: var(--accent); }
dialog.sheet { border: 0; border-radius: var(--radius); background: var(--bg); color: var(--text); padding: 1.3rem 1.2rem 1.1rem;
               width: min(100% - 2rem, 28rem); max-height: 88vh; overflow: auto; box-shadow: 0 1.2rem 3rem rgba(0,0,0,.18); }
dialog.sheet.wide { width: min(100% - 1.5rem, 42rem); }
dialog.sheet::backdrop { background: rgba(40, 32, 30, .45); backdrop-filter: blur(2px); }
dialog.sheet h2 { font-family: var(--round); font-size: 1.25rem; color: var(--ink); margin: 0 0 .3rem; }
dialog.sheet .sub { margin: 0 0 .8rem; }
.rate-scale { display: grid; grid-template-columns: repeat(5, 1fr); gap: .4rem; margin: .5rem 0 .3rem; }
.rate-scale button { border: 1px solid var(--divider); background: var(--surface); border-radius: .9rem; min-height: 3.1rem; font-size: 1.15rem; color: var(--text2); font-family: var(--serif); }
.rate-scale button.on { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.rate-words { display: flex; justify-content: space-between; font-size: .72rem; color: var(--text2); margin-bottom: .7rem; }
.rate-pick { text-align: center; font-size: .9rem; color: var(--accent); min-height: 1.4em; margin: 0 0 .6rem; }
.check { display: flex; align-items: center; gap: .5rem; font-size: .88rem; margin: .5rem 0; }
.check input { width: 1.1rem; height: 1.1rem; accent-color: var(--accent); }
.tag-group { font-size: .74rem; color: var(--text2); margin: .45rem 0 .1rem; letter-spacing: .04em; }
.best.tags { margin: 0; gap: .35rem; }
.best.tags .chip { min-height: 2rem; padding: .3rem .75rem; font-size: .84rem; }
.tag-add { display: flex; gap: .5rem; margin: .55rem 0 .3rem; }
.tag-add input { flex: 1; min-width: 0; border: 1px solid var(--divider); border-radius: 999px; padding: .4rem .85rem; font: inherit; font-size: .86rem; background: var(--surface); color: var(--text); }
.tag-add button { white-space: nowrap; }
dialog.sheet input.stock { width: 100%; border: 1px solid var(--divider); border-radius: .9rem; padding: .5rem .8rem; font: inherit; font-size: .88rem; background: var(--surface); color: var(--text); margin: .1rem 0 .3rem; }
dialog.sheet textarea { width: 100%; border: 1px solid var(--divider); border-radius: .9rem; padding: .6rem .8rem; font: inherit; background: var(--surface); color: var(--text); resize: vertical; min-height: 3.6rem; }
.sheet-actions { display: flex; flex-direction: column; gap: .5rem; margin-top: .8rem; }
.gate { border: 1px dashed var(--divider); border-radius: 1.1rem; padding: 1rem; text-align: center; background: var(--surface); }
.gate p { margin: 0 0 .7rem; font-size: .92rem; }
.badge-pick { display: flex; flex-wrap: wrap; gap: .4rem; margin: .3rem 0 .6rem; }
.badge-pick button { border: 1px solid var(--divider); background: transparent; border-radius: .9rem; padding: .25rem .5rem .25rem .3rem; display: flex; align-items: center; gap: .3rem; font-size: .8rem; color: var(--text2); min-height: 2.3rem; }
.badge-pick button svg { width: 1.6rem; height: 1.6rem; }
.badge-pick button.on { border-color: var(--ink); color: var(--ink); background: var(--surface); }
.badge-pick button:disabled { opacity: .45; }

.reveal { text-align: center; }
.reveal .art { position: relative; width: 9rem; height: 9rem; margin: .4rem auto .6rem; }
.reveal .art svg { width: 100%; height: 100%; animation: badge-in .7s cubic-bezier(.2,.9,.3,1.2) both; }
.reveal .name { font-family: var(--serif); font-size: 1.6rem; color: var(--ink); margin: .2rem 0 .1rem; }
.reveal .rarity { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.reveal .rarity.zh { letter-spacing: .04em; }
.spark { position: absolute; width: .5rem; height: .5rem; border-radius: 50%; background: var(--accent); opacity: 0; animation: spark 1.3s ease-out .35s both; }
.spark:nth-child(2) { background: var(--matcha); animation-delay: .5s; }
.spark:nth-child(3) { background: var(--ink); animation-delay: .65s; width: .35rem; height: .35rem; }
.spark:nth-child(4) { animation-delay: .8s; width: .4rem; height: .4rem; }
@keyframes badge-in { from { transform: scale(.4) rotate(-8deg); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes spark { 0% { opacity: 0; transform: translate(0, 0) scale(.4); } 30% { opacity: .9; } 100% { opacity: 0; transform: translate(var(--dx, 2rem), var(--dy, -2.5rem)) scale(1); } }
@media (prefers-reduced-motion: reduce) { .reveal .art svg, .spark { animation: none; } .spark { display: none; } }

.coll-head { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; flex-wrap: wrap; }
.coll-progress { font-family: var(--serif); font-size: 1.3rem; color: var(--ink); }
.coll-next { font-size: .85rem; color: var(--text2); margin: .2rem 0 .8rem; }
.shelf { font-family: var(--round); font-size: 1rem; color: var(--ink); margin: .9rem 0 .1rem; }
.shelf-box { margin-top: .6rem; padding: .5rem .8rem .7rem; background: transparent; }
.shelf-box summary { justify-content: space-between; gap: .6rem; }
.shelf-box summary .shelf { margin: 0; }
.shelf-count { font-size: .8rem; font-weight: 500; color: var(--text2); font-variant-numeric: tabular-nums; }
.shelf-note { margin: .1rem 0 .6rem; }
.badge-grid + .mystery-grid { margin-top: .6rem; }
.badge-grid.mystery-grid { grid-template-columns: repeat(auto-fill, minmax(3.6rem, 1fr)); gap: .45rem; }
.mystery-grid .badge-cell.mystery { min-height: 4.2rem; padding: .35rem .2rem; border-radius: .9rem; }
.mystery-grid .badge-cell.mystery .q { font-size: 1.4rem; margin-bottom: .15rem; }
.mystery-grid .badge-cell.mystery .bn { font-size: .66rem; }
.badge-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(6.4rem, 1fr)); gap: .6rem; }
.badge-cell { border: 0; background: var(--surface); border-radius: 1.1rem; padding: .6rem .4rem .5rem; text-align: center; color: var(--text); cursor: pointer; }
.badge-cell svg { width: 4.6rem; height: 4.6rem; display: block; margin: 0 auto .3rem; }
.badge-cell.locked svg { filter: grayscale(1) opacity(.42); }
.badge-cell .bn { font-size: .78rem; line-height: 1.25; display: block; }
.badge-cell .bp { font-size: .7rem; color: var(--text2); display: block; margin-top: .15rem; }
.badge-detail { text-align: center; }
.badge-detail svg { width: 7rem; height: 7rem; }
.badge-detail.locked svg { filter: grayscale(1) opacity(.42); }
.meter { height: .5rem; border-radius: 999px; background: var(--divider); overflow: hidden; margin: .5rem 0; }
.meter i { display: block; height: 100%; background: var(--ink); border-radius: 999px; }

/* Mystery badges, the rarity legend and the account sheet. */
.rarity-legend { display: flex; flex-wrap: wrap; gap: .4rem; margin: .2rem 0 .3rem; }
.rarity-pill { font-size: .74rem; padding: .22rem .6rem; border-radius: 999px; border: 1px solid var(--divider); color: var(--text2); }
.rarity-pill.rare { border-color: #9C8FB0; } .rarity-pill.epic { border-color: #B2767F; } .rarity-pill.legendary { border-color: #C2A05A; }
.badge-cell.mystery { cursor: default; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 7.2rem; border: 1.5px dashed var(--divider); background: transparent; }
.badge-cell.mystery .q { font-family: var(--serif); font-size: 2.2rem; color: var(--divider); line-height: 1; margin-bottom: .3rem; }
.badge-cell.mystery.rare { border-color: #9C8FB0; } .badge-cell.mystery.epic { border-color: #B2767F; } .badge-cell.mystery.legendary { border-color: #C2A05A; border-style: double; border-width: 3px; }
.badge-cell.mystery .bn { color: var(--text2); }
label.field { display: block; margin: .5rem 0; font-size: .85rem; color: var(--text2); }
label.field span { display: block; margin-bottom: .2rem; }
label.field input { width: 100%; border: 1px solid var(--divider); border-radius: .9rem; padding: .6rem .8rem; font: inherit; background: var(--surface); color: var(--text); }

/* Chinese pages: the long quote reads in the system Chinese face, one font for every character,
   so weights and sizes cannot drift mid-sentence on phones without a Chinese serif. */
html[lang="zh-CN"] .quote, html[lang="zh-CN"] .alt p, html[lang="zh-CN"] details p, html[lang="zh-CN"] details li { font-family: var(--zh-sans); font-weight: 400; letter-spacing: .01em; }
/* Names and headlines stay in the serif where one exists; Latin and digits come from Georgia. */
html[lang="zh-CN"] .name, html[lang="zh-CN"] .reveal .name { font-weight: 400; font-synthesis: none; }

/* Narrow phones: four header buttons and the wordmark do not fit, so the mascot stands alone. */
@media (max-width: 400px) {
  .wordmark > span:last-child { display: none; }
  .lang { padding: .3rem .55rem; }
  .icon-btn .count { margin-left: .2rem; }
}

/* Small print everywhere, not only in the film block: dialogs used to fall back to body size. */
.mini { font-size: .78rem; color: var(--text2); line-height: 1.5; margin: .35rem 0; }
/* The training choice: the note and the option are the same size and colour, so neither hides. */
.consent { margin: .7rem 0 .2rem; padding: .6rem .75rem; border-radius: .9rem; background: var(--surface); }
.consent .check { font-size: .84rem; line-height: 1.5; color: var(--text); margin: 0; }
.consent .check { align-items: flex-start; }
.consent .check input { margin-top: .2rem; flex-shrink: 0; }
