/* ===== BK-FONT-01 自托管气质字体（OFL，仅静态文字使用；动态内容走系统黑体） ===== */ @import url("./webfonts/noto/yzy-sans-fallback.css"); @font-face{font-family:"YZY Serif";src:url("./webfonts/yzy-serif-bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;} @font-face{font-family:"YZY Kai";src:url("./webfonts/yzy-kai.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;} @font-face{font-family:"YZY FangSong";src:url("./webfonts/yzy-fangsong.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;} /* ===== BK-FONT-03 正文核心包（YZY Sans = Noto Sans SC 自托管，OFL 1.1，零外链）===== */ @font-face { font-family: "YZY Sans"; font-weight: 400; font-style: normal; font-display: swap; src: url("./webfonts/yzy-sans-400-core.woff2") format("woff2"); unicode-range: U+20-7e, U+a9, U+b7, U+d7, U+2013, U+2014, U+2022, U+2026, U+2039, U+203a, U+2190, U+2192, U+2264, U+2265, U+2460, U+25c6, U+2600, U+2601, U+2605, U+2606, U+2640, U+2642, U+26a0, U+2702, U+3001, U+3002, U+300a-300d, U+3010, U+3011, U+30fb, U+4e00, U+4e03, U+4e09-4e0b, U+4e0d, U+4e0e, U+4e13, U+4e14, U+4e16, U+4e1a, U+4e22, U+4e24, U+4e25, U+4e2a, U+4e2d, U+4e32, U+4e3a, U+4e3b, U+4e45, U+4e49, U+4e4b, U+4e50, U+4e5d, U+4e5f, U+4e70, U+4e86, U+4e8b, U+4e8c, U+4e8e, U+4e91, U+4e92, U+4e94, U+4ea4, U+4ea7, U+4eab, U+4eac, U+4eae, U+4eba, U+4ec5, U+4eca, U+4ecb, U+4ecd, U+4ece, U+4ed3, U+4ed6, U+4ee3, U+4ee5, U+4eea, U+4eec, U+4ef6, U+4ef7, U+4efb, U+4efd, U+4eff, U+4f18-4f1a, U+4f20, U+4f34, U+4f46, U+4f4d-4f4f, U+4f53, U+4f55, U+4f59, U+4f5c, U+4f60, U+4f7f, U+4f9b, U+4f9d, U+4fa7, U+4fb5, U+4fbf, U+4fd7, U+4fdd, U+4fe1, U+4fee, U+5012, U+501f, U+503c, U+503e, U+5047, U+504f, U+505a, U+505c, U+5076, U+507f, U+50a8, U+50cf, U+5141, U+5145, U+5148, U+5149, U+514d, U+5154, U+515c, U+5165, U+5168, U+516b-516d, U+5171, U+5173, U+5176, U+5177, U+517b, U+5185, U+518c, U+518d, U+5199, U+51b2, U+51b7, U+51c0, U+51c6, U+51fa, U+51fb, U+5206, U+5207, U+5212, U+5217, U+5219, U+521b, U+521d, U+5220, U+5224, U+5229, U+522b, U+5230, U+5236, U+5237, U+523b, U+524d, U+5272, U+529b, U+529e-52a1, U+52a8, U+52a9, U+52bf, U+52fe-5300, U+5305, U+5316, U+5317, U+5339-533b, U+533f, U+5341, U+5347, U+534e, U+534f, U+5355, U+5356, U+535a, U+5360, U+5361, U+5370, U+5373, U+538b, U+539f, U+53bb, U+53c2, U+53c8, U+53ca, U+53cc, U+53cd, U+53d1, U+53d6-53d8, U+53e3, U+53e5, U+53ea, U+53ef, U+53f0, U+53f3, U+53f7, U+53f8, U+5408, U+540c-540e, U+5411, U+5417, U+5426, U+5427, U+542b, U+542c, U+542f, U+5438, U+544a, U+5458, U+5468, U+547d, U+548c, U+54a8, U+54aa, U+54c1, U+54cd, U+54e5, U+54e6, U+552e, U+552f, U+5546, U+5566, U+5584, U+5668, U+56db, U+56de, U+56e0, U+56f4, U+56fa, U+56fd, U+56fe, U+5706, U+5728, U+5730, U+5733, U+573a, U+5740, U+5747, U+5750, U+5757, U+575b, U+5782, U+578b, U+57ce, U+57df, U+57fa, U+5821, U+586b, U+5883, U+5899, U+589e, U+58f0, U+5904, U+5907, U+590d, U+5916, U+591a, U+5927, U+5929, U+5931, U+5934, U+5939, U+5954, U+5957, U+5976, U+597d, U+5982, U+59a5, U+59cb, U+59d3, U+5b50, U+5b57, U+5b58, U+5b69, U+5b83, U+5b88, U+5b89, U+5b8c, U+5b98, U+5b9a, U+5b9d, U+5b9e, U+5ba0-5ba2, U+5bab, U+5bb3, U+5bb6, U+5bb9, U+5bbd, U+5bc4, U+5bc6, U+5bf9, U+5bfc, U+5c01, U+5c04, U+5c06, U+5c0a, U+5c0f, U+5c11, U+5c16, U+5c1a, U+5c1d, U+5c3d, U+5c3e, U+5c40, U+5c42, U+5c45, U+5c49, U+5c4f, U+5c51, U+5c55, U+5c5e, U+5c81, U+5c97, U+5dde, U+5de5, U+5de6, U+5dee, U+5df1, U+5df2, U+5e02, U+5e03, U+5e16, U+5e26, U+5e2e, U+5e38, U+5e72-5e74, U+5e76, U+5e7f, U+5e8f, U+5e93-5e95, U+5e97, U+5e9c, U+5ea6, U+5efa, U+5f00, U+5f02, U+5f0a, U+5f0f, U+5f15, U+5f20, U+5f31, U+5f39, U+5f3a, U+5f52, U+5f53, U+5f55, U+5f62, U+5f69, U+5f71, U+5f80, U+5f84, U+5f85, U+5f88, U+5f8b, U+5f97, U+5faa, U+5fae, U+5fc3, U+5fc5, U+5fc6, U+5fd7, U+5fd8, U+5feb, U+5ff5, U+5ffd, U+6001, U+6015, U+6016, U+601d, U+6027, U+603b, U+6050, U+6062, U+606f, U+6076, U+60a8, U+60ac, U+60c5, U+60dc, U+60f3, U+6108, U+610f, U+611f, U+613f, U+614e, U+6210, U+6211, U+6216, U+6218, U+6237, U+6240, U+6241, U+624b, U+624d, U+6253, U+6267, U+6270, U+6279, U+627e-6280, U+628a, U+6296, U+62a4, U+62a5, U+62ab, U+62b5, U+62b9, U+62bd, U+62c5, U+62c9, U+62cd, U+62d2, U+62d6, U+62db, U+62df, U+62e5, U+62e9, U+6301, U+6307, U+6309, U+6362, U+636e, U+6377, U+6388, U+6389, U+6392, U+63a2, U+63a5, U+63a7, U+63a8, U+63d0, U+63d2, U+63e1, U+641c, U+642c, U+643a, U+64a4, U+64ad, U+64cd, U+652f, U+6536, U+6539, U+653b, U+653e, U+653f, U+6545, U+6548, U+654f, U+6563, U+656c, U+6570, U+6574, U+6587, U+6599, U+65ad, U+65b0, U+65b9, U+65cb, U+65e0, U+65e5, U+65e7, U+65f6, U+660e, U+6613, U+661f, U+6620, U+662f, U+6635, U+663e, U+6655, U+666e, U+666f, U+6682, U+6696, U+6697, U+66b4, U+66dd, U+66f4, U+66ff, U+6700, U+6708, U+6709, U+670d, U+671d, U+671f, U+672a-672c, U+6735, U+673a, U+6743, U+6761, U+6765, U+676d, U+677f, U+6781, U+6784, U+6790, U+679c, U+67b6, U+67d0, U+67d3, U+67d4, U+67e5, U+6807, U+680f, U+6821, U+6837-6839, U+683c, U+6846, U+6848, U+684c, U+6863, U+6865, U+68c0, U+6982, U+69db, U+6a21, U+6a2a, U+6a58, U+6b21, U+6b22, U+6b3e, U+6b62-6b65, U+6b7b, U+6b8a, U+6ba1, U+6bb5, U+6bc1, U+6bcd, U+6bcf, U+6bd4, U+6bdb, U+6c11, U+6c14, U+6c1b, U+6c34, U+6c38, U+6c42, U+6c49, U+6ca1, U+6cbb, U+6cbf, U+6cc4, U+6cd5, U+6cdb, U+6ce8, U+6d17, U+6d3b, U+6d41, U+6d45, U+6d4b, U+6d4f, U+6d6e, U+6d77, U+6d88, U+6dc6, U+6de1, U+6df1, U+6df7, U+6dfb, U+6e05, U+6e10, U+6e20, U+6e21, U+6e29, U+6e32, U+6e90, U+6eaf, U+6eda, U+6ee1, U+6ef4, U+6fc0, U+704c, U+7070, U+70b9, U+70c1, U+7126, U+7167, U+722a, U+722c, U+7231, U+7247, U+7248, U+724c, U+7269, U+7279, U+72af, U+72b6, U+72d7, U+72ec, U+732b, U+73af, U+73b0, U+73cd, U+7406, U+751f, U+7528, U+7531, U+7533, U+7535, U+753b, U+754c, U+7559, U+7565, U+7591, U+7597, U+767b, U+767d, U+7684, U+7686, U+76ca, U+76d1, U+76d2, U+76d6-76d8, U+76ee, U+76f4, U+76f8, U+7701, U+770b, U+771f, U+7720, U+773c, U+775b, U+77ac, U+77e5, U+77e9, U+77ed, U+77ee, U+7801, U+7840, U+786e, U+7891, U+78b0, U+793a, U+793e, U+7981, U+79bb, U+79c1, U+79cd, U+79d1, U+79df, U+79f0, U+79fb, U+7a0b, U+7a0d, U+7a33, U+7a3f, U+7a76, U+7a7a, U+7a84, U+7a97, U+7acb, U+7ad6, U+7ad9, U+7aef, U+7b11, U+7b14, U+7b26, U+7b2c, U+7b49, U+7b56, U+7b5b, U+7b7e, U+7b80, U+7b97, U+7ba1, U+7bb1, U+7be1, U+7c73, U+7c7b, U+7c89, U+7cbe, U+7cef, U+7cfb, U+7d20, U+7d22, U+7d27, U+7d2b, U+7d2f, U+7ea0, U+7ea2, U+7ea7, U+7eaa, U+7eaf, U+7eb5, U+7eb7, U+7eb9, U+7ebf, U+7ec4, U+7ec6, U+7ec8, U+7ecd, U+7ecf, U+7ed1, U+7ed3, U+7ed8, U+7edc, U+7edd, U+7edf, U+7ee7, U+7eed, U+7ef4, U+7efc, U+7f13, U+7f16, U+7f18, U+7f1d, U+7f3a, U+7f51, U+7f69, U+7f6e, U+7f72, U+7f8e, U+8005, U+800c, U+8010, U+8033, U+8054, U+805a, U+8096, U+80cc, U+80fd, U+8109, U+811a, U+8138, U+8165, U+81ea, U+81f3, U+81f4, U+822a, U+822c, U+826f, U+8272, U+82e5, U+82f1, U+8303, U+8350, U+83b7, U+83dc, U+8425, U+843d, U+8457, U+846c, U+85cf, U+865a, U+866b, U+8679, U+867e, U+8840, U+884c, U+8857, U+8865, U+8868, U+886c, U+88ab, U+88c1, U+892a, U+8981, U+8986, U+89c1, U+89c2, U+89c4, U+89c6, U+89c8, U+89c9, U+89d2, U+89e3, U+89e6, U+8a00, U+8a89, U+8ba1, U+8ba2, U+8ba4, U+8ba9, U+8bae, U+8bb0, U+8bb8, U+8bba, U+8bbe, U+8bbf, U+8bc1, U+8bc4, U+8bc6, U+8bc8-8bca, U+8bcd, U+8bd5, U+8bdd, U+8be2, U+8be5, U+8be6, U+8bed, U+8bef, U+8bf4, U+8bf7, U+8bfa, U+8bfb, U+8bfd, U+8c03, U+8c22-8c24, U+8c28, U+8c31, U+8c46, U+8c61, U+8d1d, U+8d1f, U+8d23, U+8d25, U+8d26, U+8d28, U+8d35, U+8d39, U+8d44, U+8d4b, U+8d4c, U+8d54, U+8d5b, U+8d5e, U+8d70, U+8d74, U+8d77, U+8d85, U+8d8a, U+8d8b, U+8db3, U+8ddd, U+8de8, U+8def, U+8df3, U+8eab, U+8f66, U+8f6c, U+8f7b, U+8f7d, U+8f83, U+8f85, U+8f91, U+8f93, U+8fb1, U+8fb9, U+8fc7, U+8fce, U+8fd0, U+8fd1, U+8fd4, U+8fd8, U+8fd9, U+8fdb-8fde, U+8ffd, U+9000-9002, U+9009, U+900f, U+9010, U+9014, U+901a, U+9020, U+903b, U+9047, U+9053, U+906e, U+9075, U+907f, U+90ae, U+90e8, U+90fd, U+914d, U+9192, U+91c7, U+91cc, U+91cd, U+91cf, U+91d1, U+9488, U+94ae, U+94c3, U+94db, U+94ed, U+94fa, U+94fe, U+9500, U+9501, U+9519, U+951a, U+952e, U+957f, U+95e8, U+95ea, U+95ed, U+95ee, U+95f4, U+9605, U+9632, U+9634, U+9636, U+963b, U+9645, U+9646, U+964d, U+9650, U+9662, U+9664, U+966a, U+968f, U+9690, U+9694, U+969c, U+96be, U+96c6, U+96f6, U+96fe, U+9700, U+9732, U+9759, U+975e, U+9760, U+9762, U+97f3, U+9875, U+9876, U+9879, U+987b, U+9884, U+9886, U+9891, U+9897, U+9898, U+98ce, U+9986, U+9988, U+9996, U+9a73, U+9a7b, U+9a82, U+9a8c, U+9a97, U+9a9a, U+9aa4, U+9aa8, U+9ad8, U+9e1f, U+9ec4, U+9ed1, U+9ed8, U+9f20, U+9f50, U+ff01, U+ff08, U+ff09, U+ff0b, U+ff0c, U+ff0f, U+ff1a, U+ff1b, U+ff1d, U+ff1f, U+ff5c; } @font-face { font-family: "YZY Sans"; font-weight: 700; font-style: normal; font-display: swap; src: url("./webfonts/yzy-sans-700-core.woff2") format("woff2"); unicode-range: U+20-7e, U+a9, U+b7, U+d7, U+2013, U+2014, U+2022, U+2026, U+2039, U+203a, U+2190, U+2192, U+2264, U+2265, U+2460, U+25c6, U+2600, U+2601, U+2605, U+2606, U+2640, U+2642, U+26a0, U+2702, U+3001, U+3002, U+300a-300d, U+3010, U+3011, U+30fb, U+4e00, U+4e03, U+4e09-4e0b, U+4e0d, U+4e0e, U+4e13, U+4e14, U+4e16, U+4e1a, U+4e22, U+4e24, U+4e25, U+4e2a, U+4e2d, U+4e32, U+4e3a, U+4e3b, U+4e45, U+4e49, U+4e4b, U+4e50, U+4e5d, U+4e5f, U+4e70, U+4e86, U+4e8b, U+4e8c, U+4e8e, U+4e91, U+4e92, U+4e94, U+4ea4, U+4ea7, U+4eab, U+4eac, U+4eae, U+4eba, U+4ec5, U+4eca, U+4ecb, U+4ecd, U+4ece, U+4ed3, U+4ed6, U+4ee3, U+4ee5, U+4eea, U+4eec, U+4ef6, U+4ef7, U+4efb, U+4efd, U+4eff, U+4f18-4f1a, U+4f20, U+4f34, U+4f46, U+4f4d-4f4f, U+4f53, U+4f55, U+4f59, U+4f5c, U+4f60, U+4f7f, U+4f9b, U+4f9d, U+4fa7, U+4fb5, U+4fbf, U+4fd7, U+4fdd, U+4fe1, U+4fee, U+5012, U+501f, U+503c, U+503e, U+5047, U+504f, U+505a, U+505c, U+5076, U+507f, U+50a8, U+50cf, U+5141, U+5145, U+5148, U+5149, U+514d, U+5154, U+515c, U+5165, U+5168, U+516b-516d, U+5171, U+5173, U+5176, U+5177, U+517b, U+5185, U+518c, U+518d, U+5199, U+51b2, U+51b7, U+51c0, U+51c6, U+51fa, U+51fb, U+5206, U+5207, U+5212, U+5217, U+5219, U+521b, U+521d, U+5220, U+5224, U+5229, U+522b, U+5230, U+5236, U+5237, U+523b, U+524d, U+5272, U+529b, U+529e-52a1, U+52a8, U+52a9, U+52bf, U+52fe-5300, U+5305, U+5316, U+5317, U+5339-533b, U+533f, U+5341, U+5347, U+534e, U+534f, U+5355, U+5356, U+535a, U+5360, U+5361, U+5370, U+5373, U+538b, U+539f, U+53bb, U+53c2, U+53c8, U+53ca, U+53cc, U+53cd, U+53d1, U+53d6-53d8, U+53e3, U+53e5, U+53ea, U+53ef, U+53f0, U+53f3, U+53f7, U+53f8, U+5408, U+540c-540e, U+5411, U+5417, U+5426, U+5427, U+542b, U+542c, U+542f, U+5438, U+544a, U+5458, U+5468, U+547d, U+548c, U+54a8, U+54aa, U+54c1, U+54cd, U+54e5, U+54e6, U+552e, U+552f, U+5546, U+5566, U+5584, U+5668, U+56db, U+56de, U+56e0, U+56f4, U+56fa, U+56fd, U+56fe, U+5706, U+5728, U+5730, U+5733, U+573a, U+5740, U+5747, U+5750, U+5757, U+575b, U+5782, U+578b, U+57ce, U+57df, U+57fa, U+5821, U+586b, U+5883, U+5899, U+589e, U+58f0, U+5904, U+5907, U+590d, U+5916, U+591a, U+5927, U+5929, U+5931, U+5934, U+5939, U+5954, U+5957, U+5976, U+597d, U+5982, U+59a5, U+59cb, U+59d3, U+5b50, U+5b57, U+5b58, U+5b69, U+5b83, U+5b88, U+5b89, U+5b8c, U+5b98, U+5b9a, U+5b9d, U+5b9e, U+5ba0-5ba2, U+5bab, U+5bb3, U+5bb6, U+5bb9, U+5bbd, U+5bc4, U+5bc6, U+5bf9, U+5bfc, U+5c01, U+5c04, U+5c06, U+5c0a, U+5c0f, U+5c11, U+5c16, U+5c1a, U+5c1d, U+5c3d, U+5c3e, U+5c40, U+5c42, U+5c45, U+5c49, U+5c4f, U+5c51, U+5c55, U+5c5e, U+5c81, U+5c97, U+5dde, U+5de5, U+5de6, U+5dee, U+5df1, U+5df2, U+5e02, U+5e03, U+5e16, U+5e26, U+5e2e, U+5e38, U+5e72-5e74, U+5e76, U+5e7f, U+5e8f, U+5e93-5e95, U+5e97, U+5e9c, U+5ea6, U+5efa, U+5f00, U+5f02, U+5f0a, U+5f0f, U+5f15, U+5f20, U+5f31, U+5f39, U+5f3a, U+5f52, U+5f53, U+5f55, U+5f62, U+5f69, U+5f71, U+5f80, U+5f84, U+5f85, U+5f88, U+5f8b, U+5f97, U+5faa, U+5fae, U+5fc3, U+5fc5, U+5fc6, U+5fd7, U+5fd8, U+5feb, U+5ff5, U+5ffd, U+6001, U+6015, U+6016, U+601d, U+6027, U+603b, U+6050, U+6062, U+606f, U+6076, U+60a8, U+60ac, U+60c5, U+60dc, U+60f3, U+6108, U+610f, U+611f, U+613f, U+614e, U+6210, U+6211, U+6216, U+6218, U+6237, U+6240, U+6241, U+624b, U+624d, U+6253, U+6267, U+6270, U+6279, U+627e-6280, U+628a, U+6296, U+62a4, U+62a5, U+62ab, U+62b5, U+62b9, U+62bd, U+62c5, U+62c9, U+62cd, U+62d2, U+62d6, U+62db, U+62df, U+62e5, U+62e9, U+6301, U+6307, U+6309, U+6362, U+636e, U+6377, U+6388, U+6389, U+6392, U+63a2, U+63a5, U+63a7, U+63a8, U+63d0, U+63d2, U+63e1, U+641c, U+642c, U+643a, U+64a4, U+64ad, U+64cd, U+652f, U+6536, U+6539, U+653b, U+653e, U+653f, U+6545, U+6548, U+654f, U+6563, U+656c, U+6570, U+6574, U+6587, U+6599, U+65ad, U+65b0, U+65b9, U+65cb, U+65e0, U+65e5, U+65e7, U+65f6, U+660e, U+6613, U+661f, U+6620, U+662f, U+6635, U+663e, U+6655, U+666e, U+666f, U+6682, U+6696, U+6697, U+66b4, U+66dd, U+66f4, U+66ff, U+6700, U+6708, U+6709, U+670d, U+671d, U+671f, U+672a-672c, U+6735, U+673a, U+6743, U+6761, U+6765, U+676d, U+677f, U+6781, U+6784, U+6790, U+679c, U+67b6, U+67d0, U+67d3, U+67d4, U+67e5, U+6807, U+680f, U+6821, U+6837-6839, U+683c, U+6846, U+6848, U+684c, U+6863, U+6865, U+68c0, U+6982, U+69db, U+6a21, U+6a2a, U+6a58, U+6b21, U+6b22, U+6b3e, U+6b62-6b65, U+6b7b, U+6b8a, U+6ba1, U+6bb5, U+6bc1, U+6bcd, U+6bcf, U+6bd4, U+6bdb, U+6c11, U+6c14, U+6c1b, U+6c34, U+6c38, U+6c42, U+6c49, U+6ca1, U+6cbb, U+6cbf, U+6cc4, U+6cd5, U+6cdb, U+6ce8, U+6d17, U+6d3b, U+6d41, U+6d45, U+6d4b, U+6d4f, U+6d6e, U+6d77, U+6d88, U+6dc6, U+6de1, U+6df1, U+6df7, U+6dfb, U+6e05, U+6e10, U+6e20, U+6e21, U+6e29, U+6e32, U+6e90, U+6eaf, U+6eda, U+6ee1, U+6ef4, U+6fc0, U+704c, U+7070, U+70b9, U+70c1, U+7126, U+7167, U+722a, U+722c, U+7231, U+7247, U+7248, U+724c, U+7269, U+7279, U+72af, U+72b6, U+72d7, U+72ec, U+732b, U+73af, U+73b0, U+73cd, U+7406, U+751f, U+7528, U+7531, U+7533, U+7535, U+753b, U+754c, U+7559, U+7565, U+7591, U+7597, U+767b, U+767d, U+7684, U+7686, U+76ca, U+76d1, U+76d2, U+76d6-76d8, U+76ee, U+76f4, U+76f8, U+7701, U+770b, U+771f, U+7720, U+773c, U+775b, U+77ac, U+77e5, U+77e9, U+77ed, U+77ee, U+7801, U+7840, U+786e, U+7891, U+78b0, U+793a, U+793e, U+7981, U+79bb, U+79c1, U+79cd, U+79d1, U+79df, U+79f0, U+79fb, U+7a0b, U+7a0d, U+7a33, U+7a3f, U+7a76, U+7a7a, U+7a84, U+7a97, U+7acb, U+7ad6, U+7ad9, U+7aef, U+7b11, U+7b14, U+7b26, U+7b2c, U+7b49, U+7b56, U+7b5b, U+7b7e, U+7b80, U+7b97, U+7ba1, U+7bb1, U+7be1, U+7c73, U+7c7b, U+7c89, U+7cbe, U+7cef, U+7cfb, U+7d20, U+7d22, U+7d27, U+7d2b, U+7d2f, U+7ea0, U+7ea2, U+7ea7, U+7eaa, U+7eaf, U+7eb5, U+7eb7, U+7eb9, U+7ebf, U+7ec4, U+7ec6, U+7ec8, U+7ecd, U+7ecf, U+7ed1, U+7ed3, U+7ed8, U+7edc, U+7edd, U+7edf, U+7ee7, U+7eed, U+7ef4, U+7efc, U+7f13, U+7f16, U+7f18, U+7f1d, U+7f3a, U+7f51, U+7f69, U+7f6e, U+7f72, U+7f8e, U+8005, U+800c, U+8010, U+8033, U+8054, U+805a, U+8096, U+80cc, U+80fd, U+8109, U+811a, U+8138, U+8165, U+81ea, U+81f3, U+81f4, U+822a, U+822c, U+826f, U+8272, U+82e5, U+82f1, U+8303, U+8350, U+83b7, U+83dc, U+8425, U+843d, U+8457, U+846c, U+85cf, U+865a, U+866b, U+8679, U+867e, U+8840, U+884c, U+8857, U+8865, U+8868, U+886c, U+88ab, U+88c1, U+892a, U+8981, U+8986, U+89c1, U+89c2, U+89c4, U+89c6, U+89c8, U+89c9, U+89d2, U+89e3, U+89e6, U+8a00, U+8a89, U+8ba1, U+8ba2, U+8ba4, U+8ba9, U+8bae, U+8bb0, U+8bb8, U+8bba, U+8bbe, U+8bbf, U+8bc1, U+8bc4, U+8bc6, U+8bc8-8bca, U+8bcd, U+8bd5, U+8bdd, U+8be2, U+8be5, U+8be6, U+8bed, U+8bef, U+8bf4, U+8bf7, U+8bfa, U+8bfb, U+8bfd, U+8c03, U+8c22-8c24, U+8c28, U+8c31, U+8c46, U+8c61, U+8d1d, U+8d1f, U+8d23, U+8d25, U+8d26, U+8d28, U+8d35, U+8d39, U+8d44, U+8d4b, U+8d4c, U+8d54, U+8d5b, U+8d5e, U+8d70, U+8d74, U+8d77, U+8d85, U+8d8a, U+8d8b, U+8db3, U+8ddd, U+8de8, U+8def, U+8df3, U+8eab, U+8f66, U+8f6c, U+8f7b, U+8f7d, U+8f83, U+8f85, U+8f91, U+8f93, U+8fb1, U+8fb9, U+8fc7, U+8fce, U+8fd0, U+8fd1, U+8fd4, U+8fd8, U+8fd9, U+8fdb-8fde, U+8ffd, U+9000-9002, U+9009, U+900f, U+9010, U+9014, U+901a, U+9020, U+903b, U+9047, U+9053, U+906e, U+9075, U+907f, U+90ae, U+90e8, U+90fd, U+914d, U+9192, U+91c7, U+91cc, U+91cd, U+91cf, U+91d1, U+9488, U+94ae, U+94c3, U+94db, U+94ed, U+94fa, U+94fe, U+9500, U+9501, U+9519, U+951a, U+952e, U+957f, U+95e8, U+95ea, U+95ed, U+95ee, U+95f4, U+9605, U+9632, U+9634, U+9636, U+963b, U+9645, U+9646, U+964d, U+9650, U+9662, U+9664, U+966a, U+968f, U+9690, U+9694, U+969c, U+96be, U+96c6, U+96f6, U+96fe, U+9700, U+9732, U+9759, U+975e, U+9760, U+9762, U+97f3, U+9875, U+9876, U+9879, U+987b, U+9884, U+9886, U+9891, U+9897, U+9898, U+98ce, U+9986, U+9988, U+9996, U+9a73, U+9a7b, U+9a82, U+9a8c, U+9a97, U+9a9a, U+9aa4, U+9aa8, U+9ad8, U+9e1f, U+9ec4, U+9ed1, U+9ed8, U+9f20, U+9f50, U+ff01, U+ff08, U+ff09, U+ff0b, U+ff0c, U+ff0f, U+ff1a, U+ff1b, U+ff1d, U+ff1f, U+ff5c; } /* ===================================================================== 云爪印 · 全站统一主题 cloud-paw-theme.css （v2 · 真实变量对齐版） 基调：暖紫 + 暖黄，纪念 / 治愈 用法：所有 HTML 页面在 里、页面自有样式之前统一外链： 规则：页面内不再重复写 :root、不再写死十六进制颜色，一律用 var(--xxx) --------------------------------------------------------------------- 变量来源（已逐行核对源文件）： 【A 区】源文件原值 = user-center.html（版面终版审核OK，作为全站基准） + pet-detail.html 独有的补充变量 【B 区】派生补充令牌 = 为全站组件统一新增，均由 A 区色板推导，非源文件原值 冲突处理：user-center 与 pet-detail 不一致的 8 处，统一取 user-center 基准值 ===================================================================== */ /* ===== BK-UI#111c 页面入场水平零位移：根元素永久预留经典滚动条等宽槽位，避免加载期滚动条"无→有→无"把 margin:0 auto 居中容器顶得右→左→右晃；手机悬浮滚动条不占位、自动无副作用（详见 #111c 裁定书） ===== */ html{scrollbar-gutter:stable; background-color:#F3EEF9; overflow-x:hidden;} /* ========== 1. 设计令牌（Design Tokens） ========== */ :root { /* ===== A 区：源文件原值（禁止改动） ===== */ /* —— A.1 品牌基础色（user-center 基准，13 个） —— */ --bg-page: #F3EEF9; /* 页面底色：淡暖紫 */ --card-warm: #FFF9E8; /* 暖色卡片底：奶油 */ --card-warm-hover: #FFF2D4; /* 暖色卡片悬停 */ --card-white: #FFFFFF; /* 白色卡片底 */ --card-white-hover: #F8F4FD; /* 白色卡片悬停：极淡紫 */ --card-border: #E8E0F2; /* 卡片/输入框边框：淡紫 */ --btn-yellow: #FFDD99; /* 主按钮：暖黄 */ --btn-yellow-hover: #FFD280; /* 主按钮悬停 */ --text-title: #443854; /* 标题/重点文字：深梅紫 */ --text-body: #5A4E6B; /* 正文 */ --text-aux: #867899; /* 辅助/说明文字 */ --text-link: #9F7FC9; /* 链接/强调：柔紫 */ --dot-red: #FF5959; /* 红点/危险/必填 */ /* —— A.2 文字补充色（pet-detail 独有，合并） —— */ --text-light: #777777; /* 更浅的辅助文字 */ --text-link-hover: #7A5FA8; /* 链接悬停深紫 */ /* —— A.3 危险色（pet-detail 独有） —— */ --danger-red: #E86C6C; --danger-red-hover: #d45a5a; /* —— A.4 宠物状态标签色（pet-detail 独有） —— */ --tag-alive-bg: #E6F7EF; /* 在身边 · 底 */ --tag-alive-text: #349E75; /* 在身边 · 字 */ --tag-rainbow-bg: #F1E9F8; /* 纪念中/彩虹桥 · 底 */ --tag-rainbow-text: #8A66B8; /* 纪念中/彩虹桥 · 字 */ --cloud-bg: #F9F5FC; /* 云状/中性浅底 */ /* —— A.5 圆角（源文件原值） —— */ --radius-large: 16px; --radius-medium: 14px; --radius-small: 12px; --radius-sm: 6px; /* B 区补充：小号圆角（徽章内缩、高亮块等） */ --radius-tag: 12px; /* pet-detail：标签圆角 */ /* —— A.6 间距 / 页面宽度（user-center 基准） —— */ --page-padding: 24px; --gap-large: 24px; --gap-medium: 16px; /* pet-detail 为 20px，统一取基准 16px */ --gap-small: 12px; --page-max-width: 1300px; /* pet-detail 为 1200px，统一取基准 1300px */ /* —— A.7 控件尺寸（pet-detail 独有） —— */ --input-height: 40px; --btn-height: 36px; /* —— A.8 动效 / 阴影（源文件原值） —— */ --transition: 0.3s ease; --shadow-hover: 0 2px 10px rgba(184, 156, 216, 0.08); /* pet-detail：悬停阴影 */ /* ===== B 区：派生补充令牌（为全站组件统一新增，由 A 区推导） ===== */ /* —— B.1 渐变（个人中心暖紫系，组件级复用） —— */ --grad-primary: linear-gradient(135deg, #B79FDD 0%, #9F7FC9 100%); /* 头部/标题区，配白字 */ --grad-primary-deep: linear-gradient(135deg, #9F7FC9 0%, #7A5FA8 100%); /* 深一档，强对比主视觉 */ --grad-soft: linear-gradient(135deg, #E7DCF6 0%, #F3EEF9 100%); /* 柔和浅紫分区背景 */ --grad-warm: linear-gradient(135deg, #F3E9FB 0%, #FFF6E0 100%); /* 紫→暖黄，治愈/空状态/宠物封面兜底 */ --grad-memorial: radial-gradient(circle at 22% 18%, #FFF3D6 0%, #EADDF7 68%, #E2D4F3 100%); /* 纪念模块柔光 */ /* —— B.2 阴影补充（A 区只有 --shadow-hover，卡片常态需补充） —— */ --shadow-sm: 0 2px 8px rgba(68, 56, 84, .06); --shadow-card: 0 6px 20px rgba(68, 56, 84, .08); --shadow-warm: 0 6px 20px rgba(253, 221, 153, .28); --shadow-modal: 0 20px 60px rgba(68, 56, 84, .18); --shadow-drawer-side: -8px 0 30px rgba(68, 56, 84, .16); --shadow-drawer-bottom: 0 -8px 40px rgba(68, 56, 84, .10); /* —— B.3 商家状态色（E4 四态映射，由 A 区推导） —— */ --ok: #5BB381; --ok-bg: #E8F6EE; /* approved 已入驻 */ --warn: #E0A64B; --warn-bg: #FCF3E2; /* pending 待审核 */ --muted: #867899; --muted-bg:#F0ECF6; /* inactive 已关停 / none 未入驻 */ /* rejected 已驳回直接复用 A 区 --danger-red / 底用 #FDECEC */ /* —— B.3.1 金色点缀（pet-detail / pet-profile 独有：图标 / 提示文字，源文件硬编码色值收录） —— */ --gold: #C8A87A; /* 淡金：纪念/暖色图标文字 */ --gold-deep: #C4863B; /* 深金/琥珀：禁用·提醒提示文字 */ --gold-tip: #C49F58; /* 金色提示文字（pet-profile 完善档案页 .form-tip） */ /* —— B.3.2 动态广场帖子分类标签色（list.html 原值收录；陪伴日常/星光纪念/求助倾诉三分类共用同一紫调） —— */ --tag-post-bg: #EDE6F4; /* 分类标签底：淡紫 */ --tag-post-text: #6B5882; /* 分类标签字：深紫灰 */ /* —— B.4 字体 —— */ --font-base: "YZY Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif; --font-serif: "YZY Serif", "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif; --font-kai: "YZY Kai", "LXGW WenKai", "STKaiti", "KaiTi", "KaiTi_GB2312", cursive; --font-fangsong: "YZY FangSong", "Zhuque Fangsong", "STFangsong", "FangSong", "FangSong_GB2312", serif; /* —— B.5 补充（弹窗遮罩 / 表单控件强调 / 错误底 / 成功） —— */ --modal-overlay: rgba(80, 60, 90, 0.55); /* 弹窗遮罩 */ --control-accent: #9F7FC9; /* 表单勾选等控件强调（同 --text-link） */ --purple-light: #D8C8E8; /* 浅紫（次级按钮底/聚焦边，由 A 区派生） */ --purple-mid: #CBB8DF; /* 浅紫 hover（派生） */ --danger-bg: #FDECEC; /* 危险态底 */ --danger-border: #F5C8C8; /* 危险态描边 */ --success: #48A868; --success-bg: #E8F6EE; /* 成功提示（派生） */ /* —— B.6 动效时长（index.html 星星闪烁动画默认时长，JS 会按每个星星动态覆写） —— */ --duration: 3s; } /* ===== BK-FONT-01 工具类（逐元素加 class 用） ===== */ .f-serif{font-family:var(--font-serif);font-weight:700;} .f-kai{font-family:var(--font-kai);} .f-fangsong{font-family:var(--font-fangsong);} /* ===== BK-FONT-01 前台气质映射（仅命中前台专属、命名唯一的静态元素；已核查后台/动态不命中） ===== */ /* 品牌导航字：前台 a.logo 命中；admin-login 是 div.logo、admin-dashboard 是 div.brand，均不命中 */ .navbar .logo, a.logo{font-family:var(--font-serif);font-weight:700;} /* 对外落地页主标题（merchant-apply 的 h1.main-title；video-intro 不引本样式，单独加 class） */ .main-title{font-family:var(--font-serif);font-weight:700;} /* 商家落地页四大权益名（作用域限定 benefit-section，不碰 partners/pets 里动态的 .name） */ .benefit-section .name{font-family:var(--font-serif);font-weight:700;} /* 前台固定金句（login/register/password-reset/pet-profile/merchant-apply/partners 的 .slogan；后台无此类） */ .slogan{font-family:var(--font-kai);} /* 动态广场三条温暖推荐标题（仅 list 前台） */ .hot-title{font-family:var(--font-kai);} /* 前台固定空态暖语（后台空态用别的容器/innerHTML，不命中这些 class） */ .message-empty,.photo-empty,.empty-title,.empty-desc,.review-empty{font-family:var(--font-kai);} /* ========== 1.5 pets 页专属变量区（"我的宠物"独立覆盖，保持原值） ========== 作用域：仅在 （我的宠物页）生效，不与 user-center 对齐。 说明：以下变量值均为 pets.html 源文件原值；与上方 A 区基准不一致的，仅对 pets 页覆盖。 */ .pets-page { /* —— 覆盖基准的通用变量（保持 pets 原值，不与 user-center 对齐） —— */ --card-border: #D8CDE8; /* 原值，基准为 #E8E0F2 */ --card-white-hover: #F1E9F8; /* 原值，基准为 #F8F4FD */ --gap-medium: 20px; /* 原值，基准为 16px */ --page-max-width: 1200px; /* 原值，基准为 1300px */ /* —— pets 独有变量（原值；带 ★ 的与基准一致，仅作独立保留声明） —— */ --card-rainbow: #FFF5F0; /* 已纪念宠物卡片特殊底 */ --btn-border: #D8CDE8; /* 查看档案按钮描边 */ --text-light: #777777; /* ★ 与基准一致 */ --danger-red: #E86C6C; /* ★ 与基准一致 */ --danger-red-hover: #d45a5a; /* ★ 与基准一致 */ --tag-alive-bg: #E8DFF5; --tag-alive-text: #443854; --tag-rainbow-bg: #E6F0FA; --tag-rainbow-text: #3A6B8A; --radius-tag: 8px; } /* ========== 2. 基础重置 ========== */ * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: var(--font-base); color: var(--text-body); background-color: var(--bg-page); line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; overscroll-behavior-x: none; } h1, h2, h3, h4 { color: var(--text-title); font-weight: 700; line-height: 1.35; } a { color: var(--text-link); text-decoration: none; transition: color var(--transition); } a:hover { color: var(--text-link-hover); } img { display: block; max-width: 100%; height: auto; } /* 页面淡入 */ @keyframes cp-fade-up { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .cp-fade { animation: cp-fade-up 0.4s cubic-bezier(.22,.61,.36,1); } /* ========== 3. 渐变容器（直接加 class 复用） ========== */ .grad-header { background: var(--grad-primary); color: #fff; border-radius: 0 0 var(--radius-large) var(--radius-large); box-shadow: var(--shadow-card); } .grad-header h1, .grad-header h2, .grad-header h3 { color: #fff; } .grad-soft { background: var(--grad-soft); border-radius: var(--radius-large); } .grad-warm { background: var(--grad-warm); border-radius: var(--radius-large); } .grad-memorial { background: var(--grad-memorial); border-radius: var(--radius-large); } /* ========== 4. 通用卡片 ========== */ .cp-card { background: var(--card-white); border: 1px solid var(--card-border); border-radius: var(--radius-large); box-shadow: var(--shadow-card); padding: var(--gap-large); transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition), background var(--transition); } .cp-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); border-color: var(--text-link); background: var(--card-white-hover); } /* 暖色卡片 */ .cp-card-warm { background: var(--card-warm); border: 1px solid var(--card-warm-hover); border-radius: var(--radius-large); box-shadow: var(--shadow-warm); padding: var(--gap-large); transition: transform var(--transition), box-shadow var(--transition), background var(--transition); } .cp-card-warm:hover { transform: translateY(-4px); background: var(--card-warm-hover); } /* ========== 5. 宠物卡片（"我的宠物"同款，标准化，使用源文件真实标签变量） ========== */ .pet-card { position: relative; background: var(--card-white); border: 1px solid var(--card-border); border-radius: var(--radius-large); box-shadow: var(--shadow-card); overflow: hidden; cursor: pointer; transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition); } .pet-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-hover); border-color: var(--text-link); } /* 顶部柔和渐变条（可放封面图；无图时用渐变兜底） */ .pet-card__cover { height: 88px; background: var(--grad-warm); position: relative; } .pet-card__cover img { width: 100%; height: 100%; object-fit: cover; } /* 头像：压在封面与内容交界处，白圈描边 */ .pet-card__avatar { position: absolute; left: var(--gap-large); bottom: -34px; width: 76px; height: 76px; border-radius: 50%; object-fit: cover; border: 3px solid var(--card-white); box-shadow: var(--shadow-sm); background: var(--cloud-bg); } .pet-card__body { padding: 44px var(--gap-large) var(--gap-large); } .pet-card__name { font-size: 19px; font-weight: 700; color: var(--text-title); } .pet-card__meta { margin-top: 4px; font-size: 13px; color: var(--text-aux); } /* 品种 / 性别 / 年龄 小标签（使用源文件真实圆角 --radius-tag） */ .pet-card__tags { display: flex; flex-wrap: wrap; gap: var(--gap-small); margin-top: var(--gap-medium); } .pet-tag { font-size: 12px; color: var(--tag-rainbow-text); background: var(--tag-rainbow-bg); padding: 3px 10px; border-radius: var(--radius-tag); } /* 陪伴状态徽章：在身边 / 纪念中 / 已离开（前两类用源文件真实标签色） */ .pet-card__status { position: absolute; top: var(--gap-medium); right: var(--gap-medium); font-size: 12px; padding: 4px 12px; border-radius: var(--radius-tag); } .pet-card__status--alive { color: var(--tag-alive-text); background: var(--tag-alive-bg); } /* 在身边 */ .pet-card__status--memory { color: var(--tag-rainbow-text); background: var(--tag-rainbow-bg); } /* 纪念中/彩虹桥 */ .pet-card__status--left { color: var(--text-aux); background: var(--cloud-bg); } /* 已离开（中性） */ .pet-card__actions { margin-top: var(--gap-large); display: flex; gap: var(--gap-medium); } /* ========== 6. 按钮 ========== */ .cp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-family: var(--font-base); font-size: 15px; font-weight: 600; border: none; border-radius: 999px; min-height: var(--btn-height); padding: 0 26px; cursor: pointer; transition: transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition); } .cp-btn:active { transform: scale(.97); } /* 主按钮：暖黄 */ .cp-btn-primary { background: var(--btn-yellow); color: var(--text-title); box-shadow: var(--shadow-warm); } .cp-btn-primary:hover { background: var(--btn-yellow-hover); transform: translateY(-2px); } /* 次按钮：紫描边 */ .cp-btn-ghost { background: transparent; color: var(--text-link); border: 1.5px solid var(--text-link); } .cp-btn-ghost:hover { background: var(--tag-rainbow-bg); color: var(--text-link-hover); border-color: var(--text-link-hover); } /* 紫色实心按钮 */ .cp-btn-purple { background: var(--grad-primary); color: #fff; box-shadow: var(--shadow-card); } .cp-btn-purple:hover { background: var(--grad-primary-deep); transform: translateY(-2px); } .cp-btn-block { width: 100%; } .cp-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; } /* 导航右侧登录/注册按钮（未登录态） */ .nav-auth { display: flex; align-items: center; gap: 10px; } .nav-auth .cp-btn { min-height: 38px; padding: 0 20px; font-size: 14px; } /* ========== BK-UI#111 按钮焦点环：鼠标/触摸点按不残留浏览器默认蓝黑边；键盘 Tab 保留柔和暖紫轮廓（无障碍）；焦点环即时显隐不闪边 ========== */ button:focus:not(:focus-visible), [class*="btn"]:focus:not(:focus-visible), [type="button"]:focus:not(:focus-visible), [type="submit"]:focus:not(:focus-visible), [type="reset"]:focus:not(:focus-visible) { outline: none; transition: transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition), border-color var(--transition), opacity var(--transition), outline-color 0s, outline-width 0s, outline-offset 0s; } button:focus-visible, [class*="btn"]:focus-visible, [type="button"]:focus-visible, [type="submit"]:focus-visible, [type="reset"]:focus-visible { outline: 2px solid var(--text-link); outline-offset: 2px; transition: transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition), border-color var(--transition), opacity var(--transition), outline-color 0s, outline-width 0s, outline-offset 0s; } /* ========== 7. 表单 ========== */ .cp-input, .cp-textarea, .cp-select { width: 100%; font-family: var(--font-base); font-size: 15px; color: var(--text-title); background: var(--card-white); border: 1px solid var(--card-border); border-radius: var(--radius-medium); min-height: var(--input-height); padding: 0 14px; transition: border-color var(--transition), box-shadow var(--transition); } .cp-textarea { padding: 12px 14px; min-height: 96px; resize: vertical; } .cp-input::placeholder, .cp-textarea::placeholder { color: var(--text-aux); } .cp-input:focus, .cp-textarea:focus, .cp-select:focus { outline: none; border-color: var(--text-link); box-shadow: 0 0 0 3px rgba(159, 127, 201, .15); } .cp-label { display: block; font-size: 14px; font-weight: 600; color: var(--text-title); margin-bottom: var(--gap-small); } .cp-required::before { content: "* "; color: var(--dot-red); } /* ========== 8. 状态徽章（商家四态 + 未入驻，与 E4 映射一致） ========== */ .cp-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; padding: 4px 12px; border-radius: var(--radius-tag); } .cp-badge--ok { color: var(--ok); background: var(--ok-bg); } /* approved 已入驻 */ .cp-badge--warn { color: var(--warn); background: var(--warn-bg); } /* pending 待审核 */ .cp-badge--danger { color: var(--danger-red); background: #FDECEC; } /* rejected 已驳回 */ .cp-badge--muted { color: var(--muted); background: var(--muted-bg); } /* inactive 已关停 / none 未入驻 */ /* ========== 9. 提示条 ========== */ .cp-alert { border-radius: var(--radius-medium); padding: 12px 16px; font-size: 14px; margin: var(--gap-medium) 0; } .cp-alert--error { color: var(--danger-red); background: #FDECEC; } .cp-alert--ok { color: var(--ok); background: var(--ok-bg); } .cp-alert--warn { color: var(--warn); background: var(--warn-bg); } .cp-alert--info { color: var(--text-link); background: var(--tag-rainbow-bg); } /* ========== 10. 弹窗 ========== */ @keyframes cp-pop-in { from { opacity: 0; transform: translateY(16px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } } .cp-modal-mask { position: fixed; inset: 0; background: rgba(68, 56, 84, .42); display: flex; align-items: center; justify-content: center; z-index: 1000; } .cp-modal { background: var(--card-white); border-radius: var(--radius-large); box-shadow: var(--shadow-card); padding: var(--gap-large); width: min(440px, 92vw); animation: cp-pop-in 0.4s cubic-bezier(.22,.61,.36,1); } /* ========== 11. 通用工具类 ========== */ .cp-text-title { color: var(--text-title); } .cp-text-aux { color: var(--text-aux); font-size: 13px; } .cp-text-light { color: var(--text-light); } .cp-text-link { color: var(--text-link); cursor: pointer; } .cp-divider { height: 1px; background: var(--card-border); border: none; margin: var(--gap-large) 0; } .cp-page { max-width: var(--page-max-width); margin: 0 auto; padding: var(--page-padding); } .cp-grid { display: grid; gap: var(--gap-large); } .cp-grid-2 { grid-template-columns: repeat(2, 1fr); } .cp-grid-3 { grid-template-columns: repeat(3, 1fr); } .cp-grid-4 { grid-template-columns: repeat(4, 1fr); } @media (max-width: 900px) { .cp-grid-3, .cp-grid-4 { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 600px) { .cp-grid-2, .cp-grid-3, .cp-grid-4 { grid-template-columns: 1fr; } } /* 导航遮罩：新增的空遮罩 div 在 PC(≥769px) 默认隐藏，避免空块元素影响布局 */ .nav-mask { display: none; } /* T4: 全站吸底 5 项 tab bar（默认隐藏，仅窄屏 ≥768 段内显示；I-UC 的 PC 显示由页内 .bottom-bar{display:flex} 原样保留） */ .bottom-bar { display: none; } /* ===================================================================== 手机端 T1：顶部导航真正收进汉堡抽屉（对应 G3-N1，兼治 MD-1 横滚 440） 断点：max-width:768px；≥769px 一律走 PC 原样，不动 PC 基础样式。 z-index 层级（写死，不许互相盖住）： 页面内容/顶栏(sticky):100 ｜ 导航遮罩 .nav-mask:998 ｜ 导航抽屉:999 ｜ 弹窗遮罩 .cp-modal-mask:1000 说明：抽屉为全屏遮罩式菜单；遮罩色值沿用下方 .cp-modal-mask 已有的 rgba(68,56,84,.42)，零新增色值。 ===================================================================== */ @media (max-width: 768px) { /* logo 永远完整横排，不拆字、不被压缩 */ .top-nav .logo { flex-shrink: 0; white-space: nowrap; } .top-nav .logo .badge-merchant { white-space: nowrap; } /* 汉堡按钮：44×44 触控区，Font Awesome 图标（fa-bars/fa-xmark） */ .top-nav .nav-right .menu-toggle { display: block !important; width: 44px; height: 44px; min-width: 44px; min-height: 44px; font-size: 22px; line-height: 44px; text-align: center; padding: 0; margin: 0; } .top-nav .nav-right .menu-toggle .fa-xmark { display: none; } body.mobile-nav-open .top-nav .menu-toggle .fa-bars { display: none; } body.mobile-nav-open .top-nav .menu-toggle .fa-xmark { display: inline; } /* 折叠态：导航链接 / 登录注册胶囊 / 用户胶囊 / 商家链接 全部收入抽屉。 用 body:not(.mobile-nav-open) 锁「关闭态」并提高层级（>各页内联样式，如 .btn-nav 的 display:inline-flex）， 抽屉一旦打开（body.mobile-nav-open）该规则自动失效，nav-auth / user-dropdown 才能继续走 updateNavUser 的内联显隐。 */ body:not(.mobile-nav-open) .top-nav .nav-menu { display: none; } body:not(.mobile-nav-open) .top-nav .nav-right .btn-nav { display: none; } body:not(.mobile-nav-open) .top-nav .nav-right .nav-auth { display: none; } body:not(.mobile-nav-open) .top-nav .nav-right .user-dropdown { display: none; } /* 半透明遮罩（点击关闭） */ .nav-mask { display: none; position: fixed; inset: 0; background: rgba(68, 56, 84, .42); z-index: 998; } body.mobile-nav-open .nav-mask { display: block; } /* 抽屉：顶栏变为右侧滑出面板 */ body.mobile-nav-open .top-nav { position: fixed; top: 0; right: 0; bottom: 0; width: 85vw; max-width: 320px; height: 100vh; margin: 0; padding: 0; z-index: 999; flex-direction: column; align-items: stretch; justify-content: flex-start; overflow-y: auto; background: var(--card-white); box-shadow: var(--shadow-drawer-side); } body.mobile-nav-open .top-nav .logo { display: flex; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--card-border); } body.mobile-nav-open .top-nav .menu-toggle { position: absolute; top: 8px; right: 12px; } body.mobile-nav-open .top-nav .bell-wrap { position: absolute; top: 19px; right: 66px; } body.mobile-nav-open .top-nav .nav-menu { display: flex; flex-direction: column; gap: 0; margin: 4px 0 0; } body.mobile-nav-open .top-nav .nav-menu li { width: 100%; } body.mobile-nav-open .top-nav .nav-menu a { display: flex; align-items: center; width: 100%; padding: 14px 20px; font-size: 16px; border-radius: 0; border-bottom: 1px solid var(--card-border); } body.mobile-nav-open .top-nav .nav-right { position: static; display: flex; flex-direction: column; align-items: stretch; gap: 12px; margin-top: 16px; padding: 0 20px; } body.mobile-nav-open .top-nav .nav-right .btn-nav { display: flex; align-items: center; justify-content: center; width: 100%; padding: 13px 16px; font-size: 15px; } body.mobile-nav-open .top-nav .nav-right .nav-auth { display: flex; flex-direction: column; gap: 12px; } body.mobile-nav-open .top-nav .nav-right .nav-auth .cp-btn { width: 100%; } body.mobile-nav-open .top-nav .nav-right .user-dropdown { display: block; } body.mobile-nav-open .top-nav .nav-right .user-dropdown .dropdown-menu { position: static; width: 100%; margin-top: 8px; box-shadow: none; border: 1px solid var(--card-border); } /* 抽屉打开时锁定页面背景滚动 */ body.mobile-nav-open { overflow: hidden; } /* ===== T2: 输入框字号 ≥16px，防 iOS 聚焦放大（仅窄屏生效，PC ≥769px 完全不动） ===== */ /* 全局主规则（豆包拍板 9 类：七类 input + textarea + select） */ input[type="text"], input[type="password"], input[type="tel"], input[type="email"], input[type="number"], input[type="search"], input[type="date"], textarea, select { font-size: 16px; } /* T2-覆盖: pet-profile —— .cp-select/.cp-textarea 类优先级(0,1,0) 高于全局 select/textarea(0,0,1)，同文件后置覆盖 */ .cp-select, .cp-textarea { font-size: 16px; } /* T2-覆盖: admin-login —— .form-group input 原 14px（页内样式后置，需 !important 兜底） */ .form-group input { font-size: 16px !important; } /* T2-覆盖: admin-dashboard —— .filter-bar input/select 原 14px */ .filter-bar input, .filter-bar select { font-size: 16px !important; } /* T2-覆盖: admin-dashboard/list/memorial/pet-detail/pets/user-center/merchant-dashboard —— .modal-box .form-group input/select/textarea 原 14px（pet-detail 另有一条 13px 同级后置规则，一并覆盖） */ .modal-box .form-group input, .modal-box .form-group select, .modal-box .form-group textarea { font-size: 16px !important; } /* T2-覆盖: admin-dashboard —— .reject-modal-box .form-group textarea 原 14px */ .reject-modal-box .form-group textarea { font-size: 16px !important; } /* T2-覆盖: admin-dashboard —— .pagination-wrap .controls select 原 13px */ .pagination-wrap .controls select { font-size: 16px !important; } /* T2-覆盖: admin-dashboard —— #newSensitiveWord 内联 style 原 14px（内联样式只能 !important 覆盖，不改 HTML） */ #newSensitiveWord { font-size: 16px !important; } /* T2-覆盖: merchant-apply —— .form-section .form-group input/select/textarea 原 14px */ .form-section .form-group input, .form-section .form-group select, .form-section .form-group textarea { font-size: 16px !important; } /* T2-覆盖: memorial —— .message-input-wrap input 原 14px */ .message-input-wrap input { font-size: 16px !important; } /* T2-覆盖: partners —— .filter-row .search-wrap input 原 14px */ .filter-row .search-wrap input { font-size: 16px !important; } /* T2-覆盖: partners —— .filter-row .filter-select 原 14px */ .filter-row .filter-select { font-size: 16px !important; } /* T2-覆盖: partners —— .review-form .comment-input-wrap input 原 13px */ .review-form .comment-input-wrap input { font-size: 16px !important; } /* ===== T3: 按钮禁逐字竖排 + 后台表格止血（仅窄屏生效，PC ≥769px 完全不动） ===== */ /* * B 块·通用主规则：按钮 / 提交类控件「文字不换行、flex 不收缩」， * 防止被父级 flex 挤压成「上/传/照/片」逐字竖排；max-width:100% 兜底超长不顶破容器。 */ .cp-btn, button, [type="button"], [type="submit"], [type="reset"] { white-space: nowrap; flex-shrink: 0; max-width: 100%; } /* T3-覆盖: admin-dashboard —— 页内 @768 `.quick-actions .btn-quick{flex:1}` 把 3 个操作钮 均分 100% 宽挤压成逐字竖排；用更高精度选择器 (0,3,0 > 页内 0,2,0) 去掉 flex:1， 3 钮按内容宽排布，空间不够时由父级 flex-wrap 整体换行。 */ .main-content .page-header .quick-actions .btn-quick { flex: none; } /* T3-覆盖: pet-detail —— 「上传照片」所在头部容器可换行；按钮不被左侧标题组挤压 */ .card-header-with-action { flex-wrap: wrap; gap: 12px; } .card-header-with-action .btn-upload-sm { flex-shrink: 0; } /* D 块·后台表格止血：表头与短字段 nowrap 不逐字竖排；长文本列(操作内容)允许正常换行。 .table-wrap 页内已有 overflow-x:auto，此处补齐 display:block + 触控惯性，局部横滑不拖整页。 */ .table-wrap { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .log-table th, .log-table td { white-space: nowrap; } .log-table th:last-child, .log-table td:last-child { white-space: normal; } /* ===== T4: 全站吸底 5 项 tab bar + safe-area（仅窄屏；默认隐藏 PC 零影响；基准 = I-UC 底栏） ===== */ /* 用 body 前缀提高精度 (0,1,1 > 页内 .bottom-bar 0,1,0)，统一覆盖 user-center 页内的 justify-content/background，保证 9 个显示页底栏视觉 1:1 一致；PC ≥769px 不命中本段。 */ body .bottom-bar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; flex-direction: row; align-items: center; justify-content: space-around; flex-wrap: nowrap; height: 56px; background: var(--bg-page); border-top: 1px solid var(--card-border); padding-bottom: env(safe-area-inset-bottom, 0px); z-index: 90; } body .bottom-bar a { flex: 1; min-height: 44px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--text-aux); text-decoration: none; font-size: 10px; line-height: 1; padding: 2px 4px; } body .bottom-bar a i { font-size: 18px; } body .bottom-bar a.active { color: var(--text-link); font-weight: 600; } body .bottom-bar a.active i { color: var(--text-link); } /* 主内容避让：显示底栏的 9 页主容器留出「底栏高度 + safe-area」，防末块内容被吸底栏永久遮住 */ body .page-wrapper, body .profile-wrapper { padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px)); } /* ===== T5: 独立可点元素触控热区 ≥44×44 + hover-only 常驻（仅窄屏；视觉不变；PC ≥769px 零影响） ===== */ /* 1. 关闭 X：热区 44×44（× 视觉大小不变） */ .close-btn, .modal-close { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; padding: 0; } /* 2. 动态广场卡片操作行（赞/评/藏/享）：每项热区 ≥44（PL-1 销项） */ .post-card .post-actions .action-btn { min-height: 44px; min-width: 44px; justify-content: center; } /* 3. 服务分类标签：热区 ≥44（PT-1 销项） */ .filter-tags .filter-btn { min-height: 44px; } /* 4. hover-only 常驻（窄屏不再依赖悬停才可见） */ body .post-card .owner-actions { display: flex; } /* 帖主编辑/删除 */ body .post-card .owner-actions .owner-btn { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; padding: 0; } body .user-card .avatar-wrap .avatar-hint { opacity: 1; } /* 头像「更换」提示 */ body .stat-card .click-hint { opacity: 1; } /* 后台数据卡提示 */ /* 5. 图标/小按钮：热区 ≥44（视觉内容居中） */ .btn-view, .btn-delete-text, .btn-logout-text, .expand-btn, .back-link, .tab-btn, .btn-social, .tf-btn, .btn-quick, .btn-sm, .btn-upload-sm, .btn-sec { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; } .fav-btn, .like-wrap { min-width: 44px; min-height: 44px; } .password-group .toggle-pwd { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; padding: 0; } /* 6. 后台侧栏整行可点菜单 + 退出钮 */ .sidebar .menu .menu-item { min-height: 44px; } .sidebar .logout-btn { min-height: 44px; } /* 7. 分页器 */ .pagination-wrap .page-btn { min-width: 44px; min-height: 44px; } /* 8. 窄屏输入框/下拉选择：高度 <44 补到 ≥44（checkbox/radio/file 除外） */ input[type="text"], input[type="tel"], input[type="password"], input[type="email"], input[type="number"], input[type="date"], select { min-height: 44px; } /* 9. 特殊元素①：协议/记住勾选整行热区 ≥44（勾选方块视觉不变，行内协议链接豁免） */ .agreement-check, .form-options { min-height: 44px; } /* 10. 特殊元素②：隐私 toggle-switch 热区纵向补到 ≥44（视觉 48×26 不变） */ .toggle-switch::before { content: ''; position: absolute; left: 0; right: 0; top: -9px; bottom: -9px; } /* 11. 特殊元素③：星光墙头像热区补到 44×44（视觉 40×40 不变） */ body .star-wall .star-avatar { overflow: visible; position: relative; } .star-wall .star-avatar img { border-radius: 50%; } .star-wall .star-avatar::before { content: ''; position: absolute; inset: -2px; border-radius: 50%; } /* 12. 顶导航「消息通知」铃铛（独立可点图标）热区 ≥44（铃铛视觉大小不变） */ .bell-wrap { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; } /* ===== T6: 弹窗/抽屉窄屏规范 G-N5（仅窄屏；零 DOM 零 HTML；PC ≥769px 零影响） ===== */ /* ---------- 1. 遮罩整层可滚兜底 + 16px 呼吸位（不碰 display/.active/背景/模糊/z-index） ---------- */ body .modal-overlay, body .reject-modal-overlay { overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 16px; } /* ---------- 2. A类：长表单弹窗 sticky 钉头尾（仅长表单；表C #1/#3/#5/#10/#18/#22/#23/#25；C/B类 .modal-box 不套 sticky） ---------- */ /* 容器：近全宽 + 视口高上限，保留自身 overflow-y:auto 作为内滚（同名短弹窗亦受益居中/dvh，无副作用） */ body .modal-box, body .reject-modal-box { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); width: 100%; max-width: 420px; margin: auto; box-sizing: border-box; overflow-y: auto; /* A13 #rejectModal 基类无 overflow，补内滚通道（其余 .modal-box 基类已自带，冗余无害） */ } /* P1 修复：A 类长表单盒子取消上下内边距“走廊”，改由 sticky 头尾自身 padding 承接， 使 sticky 元素贴齐滚动容器上/下边缘，内容滚动不再从顶缝透出（顶缝实证见豆包终审 P1） */ body #postModal .modal-box, body #petFormModal .modal-box, body #editPetModal .modal-box, body #editShopModal .modal-box, body #adminModal .modal-box, body #passwordModal .modal-box, body #rejectModal .reject-modal-box { padding-top: 0; padding-bottom: 0; } body #avatarModal .modal-box, body #editProfileModal .modal-box, body #changePasswordModal .modal-box, body #logoutModal .modal-box.small, body #accountDeletionModal .modal-box, body #aboutModal .modal-box { padding-top: 0; padding-bottom: 0; } /* 钉头尾通则：sticky + 不透明底（var(--card-white)=#FFFFFF，与 admin 页既有 #fff 等值，零新增色值）+ 负 margin 抵消盒子内边距铺满 */ /* —— 20px 内边距组：list / pets / pet-detail / merchant-dashboard —— */ body #postModal .modal-header, body #petFormModal .modal-header, body #editPetModal .modal-header, body #editShopModal .modal-header { position: sticky; top: 0; z-index: 1; background: var(--card-white); margin-top: 0; margin-left: -20px; margin-right: -20px; padding-top: 20px; padding-left: 20px; padding-right: 20px; } body #postModal .modal-footer, body #petFormModal .modal-footer, body #editPetModal .modal-footer, body #editShopModal .modal-footer { position: sticky; bottom: 0; z-index: 1; background: var(--card-white); margin-left: -20px; margin-right: -20px; margin-bottom: 0; padding-left: 20px; padding-right: 20px; padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); } /* —— user-center 6 弹窗：.modal-box 内边距 24px 20px（垂直 24px、水平 20px） —— */ body #avatarModal .modal-header, body #editProfileModal .modal-header, body #changePasswordModal .modal-header, body #logoutModal .modal-header, body #accountDeletionModal .modal-header, body #aboutModal .modal-header { position: sticky; top: 0; z-index: 1; background: var(--card-white); margin-top: 0; margin-left: -20px; margin-right: -20px; padding-top: 24px; padding-left: 20px; padding-right: 20px; } body #editProfileModal .modal-footer, body #changePasswordModal .modal-footer, body #logoutModal .modal-box.small .modal-footer, body #accountDeletionModal .modal-footer, body #aboutModal .modal-footer { position: sticky; bottom: 0; z-index: 1; background: var(--card-white); margin-left: -20px; margin-right: -20px; margin-bottom: 0; padding-left: 20px; padding-right: 20px; padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); } /* —— admin：#adminModal / #passwordModal（.modal-box/.modal-box.small）· #rejectModal（.reject-modal-box），内边距均为 20px —— */ body #adminModal .modal-header, body #passwordModal .modal-header, body #rejectModal .modal-header { position: sticky; top: 0; z-index: 1; background: var(--card-white); margin-top: 0; margin-left: -20px; margin-right: -20px; padding-top: 20px; padding-left: 20px; padding-right: 20px; } body #adminModal .modal-footer, body #passwordModal .modal-footer, body #rejectModal .modal-footer { position: sticky; bottom: 0; z-index: 1; background: var(--card-white); margin-left: -20px; margin-right: -20px; margin-bottom: 0; padding-left: 20px; padding-right: 20px; padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); } /* ---------- 3. B类：已有独立 body 容器的弹窗 flex 三段内滚（不套 sticky；表C #9/#14/#16/#17/#19/#20/#24） ---------- */ /* 通用协议弹窗（login/register/user-center/pet-profile 的 #agreementModal） */ body .agreement-modal-box { display: flex; flex-direction: column; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow: hidden; box-sizing: border-box; } body .agreement-modal-box .modal-close { position: absolute; top: 18px; right: 20px; float: none; margin: 0; } body .agreement-modal-box .modal-title { flex: 0 0 auto; } body .agreement-modal-box .modal-meta { flex: 0 0 auto; } body .agreement-modal-box .modal-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; min-height: 0; } body .agreement-modal-box .modal-footer-close { flex: 0 0 auto; } /* admin #logModal（.modal-box.wide + #logModalBody） */ body .modal-box.wide { display: flex; flex-direction: column; overflow: hidden; } body .modal-box.wide .modal-header { flex: 0 0 auto; } body #logModalBody { flex: 1 1 auto; overflow-y: auto; overflow-x: auto; /* N1 修复：日志表第三列窄屏硬裁切 → 横向滚动通道 */ -webkit-overflow-scrolling: touch; min-height: 0; } body #logModalBody .log-table { min-width: 560px; } body #logModalBody .log-table th, body #logModalBody .log-table td { white-space: nowrap; } body .modal-box.wide .modal-footer { flex: 0 0 auto; } /* merchant-apply #agreementModal（复用 .login-modal-box + 内联三段头/正文/尾） */ body .login-modal-overlay#agreementModal .login-modal-box { display: flex; flex-direction: column; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow: hidden; box-sizing: border-box; } body .login-modal-overlay#agreementModal .login-modal-box > div:first-child { flex: 0 0 auto; } body .login-modal-overlay#agreementModal .login-modal-box > div:nth-child(2) { flex: 1 1 auto; overflow-y: auto; min-height: 0; } body .login-modal-overlay#agreementModal .login-modal-box > div:nth-child(3) { flex: 0 0 auto; } /* ---------- 4. C类：短确认/提示弹窗 居中 + dvh 兜底（不造 H/F、不加 X、关闭逻辑不动；表C #2/#4/#6/#8/#11/#12/#13/#15/#21） ---------- */ body .delete-modal-box, body .ritual-modal-box, body .custom-modal-box, body .login-modal-box { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto; box-sizing: border-box; } /* ---------- 5. partners 商家详情抽屉：窄屏底部 sheet + z-index 上提（仅本段；≥769 恢复 999） ---------- */ body .drawer-overlay { z-index: 1000; align-items: flex-end; justify-content: center; } body .drawer-box { width: 100%; max-width: none; height: auto; max-height: 90dvh; overflow: hidden; border-radius: var(--radius-large) var(--radius-large) 0 0; padding: 24px 24px calc(20px + env(safe-area-inset-bottom, 0px)); box-shadow: var(--shadow-drawer-bottom); } body .drawer-box .drawer-body { flex: 1 1 auto; min-height: 0; } /* ---------- 6. Toast：z=2000 不动、只核位置；实测 top:24px 居中不遮挡底部主操作/底栏 → 位置亦不动（留证） ---------- */ } /* ===================================================================== BK06 横屏版面利用根治（2026-10-08，豆包裁定、哥哥书面批准） A1：触屏手机横屏（pointer:coarse + landscape + 高≤500px）内页白导航折汉堡。 块内规则逐字复制上方 768 块 T1（原 458-571 行），仅外层媒体条件不同； 命中：华为/iPhone 横屏；不命中：PC(pointer:fine)、平板横屏(高768)、一切竖屏。 不含 T2-T6：横屏保留 PC 布局，不出现吸底 tab bar、不改弹窗形态。 A2：配合全站 viewport-fit=cover，通栏固定 UI 左右避让屏幕安全区 （iPhone 横屏圆角/灵动岛）；无安全区设备 env()=0，零影响。 旧代码零删改，回滚＝删除本追加块并还原 .bak_bk06。 ===================================================================== */ @media (pointer: coarse) and (orientation: landscape) and (max-height: 500px) { /* logo 永远完整横排，不拆字、不被压缩 */ .top-nav .logo { flex-shrink: 0; white-space: nowrap; } .top-nav .logo .badge-merchant { white-space: nowrap; } /* 汉堡按钮：44×44 触控区，Font Awesome 图标（fa-bars/fa-xmark） */ .top-nav .nav-right .menu-toggle { display: block !important; width: 44px; height: 44px; min-width: 44px; min-height: 44px; font-size: 22px; line-height: 44px; text-align: center; padding: 0; margin: 0; } .top-nav .nav-right .menu-toggle .fa-xmark { display: none; } body.mobile-nav-open .top-nav .menu-toggle .fa-bars { display: none; } body.mobile-nav-open .top-nav .menu-toggle .fa-xmark { display: inline; } /* 折叠态：导航链接 / 登录注册胶囊 / 用户胶囊 / 商家链接 全部收入抽屉。 用 body:not(.mobile-nav-open) 锁「关闭态」并提高层级（>各页内联样式，如 .btn-nav 的 display:inline-flex）， 抽屉一旦打开（body.mobile-nav-open）该规则自动失效，nav-auth / user-dropdown 才能继续走 updateNavUser 的内联显隐。 */ body:not(.mobile-nav-open) .top-nav .nav-menu { display: none; } body:not(.mobile-nav-open) .top-nav .nav-right .btn-nav { display: none; } body:not(.mobile-nav-open) .top-nav .nav-right .nav-auth { display: none; } body:not(.mobile-nav-open) .top-nav .nav-right .user-dropdown { display: none; } /* 半透明遮罩（点击关闭） */ .nav-mask { display: none; position: fixed; inset: 0; background: rgba(68, 56, 84, .42); z-index: 998; } body.mobile-nav-open .nav-mask { display: block; } /* 抽屉：顶栏变为右侧滑出面板 */ body.mobile-nav-open .top-nav { position: fixed; top: 0; right: 0; bottom: 0; width: 85vw; max-width: 320px; height: 100vh; margin: 0; padding: 0; z-index: 999; flex-direction: column; align-items: stretch; justify-content: flex-start; overflow-y: auto; background: var(--card-white); box-shadow: var(--shadow-drawer-side); } body.mobile-nav-open .top-nav .logo { display: flex; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--card-border); } body.mobile-nav-open .top-nav .menu-toggle { position: absolute; top: 8px; right: 12px; } body.mobile-nav-open .top-nav .bell-wrap { position: absolute; top: 19px; right: 66px; } body.mobile-nav-open .top-nav .nav-menu { display: flex; flex-direction: column; gap: 0; margin: 4px 0 0; } body.mobile-nav-open .top-nav .nav-menu li { width: 100%; } body.mobile-nav-open .top-nav .nav-menu a { display: flex; align-items: center; width: 100%; padding: 14px 20px; font-size: 16px; border-radius: 0; border-bottom: 1px solid var(--card-border); } body.mobile-nav-open .top-nav .nav-right { position: static; display: flex; flex-direction: column; align-items: stretch; gap: 12px; margin-top: 16px; padding: 0 20px; } body.mobile-nav-open .top-nav .nav-right .btn-nav { display: flex; align-items: center; justify-content: center; width: 100%; padding: 13px 16px; font-size: 15px; } body.mobile-nav-open .top-nav .nav-right .nav-auth { display: flex; flex-direction: column; gap: 12px; } body.mobile-nav-open .top-nav .nav-right .nav-auth .cp-btn { width: 100%; } body.mobile-nav-open .top-nav .nav-right .user-dropdown { display: block; } body.mobile-nav-open .top-nav .nav-right .user-dropdown .dropdown-menu { position: static; width: 100%; margin-top: 8px; box-shadow: none; border: 1px solid var(--card-border); } /* 抽屉打开时锁定页面背景滚动 */ body.mobile-nav-open { overflow: hidden; } } /* ===== BK06 A2：viewport-fit=cover 后通栏固定 UI 左右安全区避让（全局；env 无值即为 0） ===== */ body .top-nav { padding-left: calc(var(--page-padding) + env(safe-area-inset-left, 0px)); padding-right: calc(var(--page-padding) + env(safe-area-inset-right, 0px)); } body .bottom-bar { padding-left: env(safe-area-inset-left, 0px); padding-right: env(safe-area-inset-right, 0px); } body.mobile-nav-open .top-nav .menu-toggle { right: calc(12px + env(safe-area-inset-right, 0px)); }