/* Copyright (c) 2026 dsy4567, view license at <https://github.com/dsy4567/dsy4567.github.io/blob/main/LICENSE.md> */

@charset "utf-8";

:root {
	--hostname: "dsy4567.icu";
}

/* ==================== 回退字体度量对齐 ==================== */
@font-face {
	font-family: "站酷拉丁";
	src: url(data:font/woff2;base64,d09GMgABAAAAABTgAA0AAAAAKAAAABSNAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHGgGYACCcBEICrpUqVcLghoAATYCJAOEMAQgBYQgB4MfDAcbhh2zolaSWi6B/meCefpNWUBlGAmHoDwYDoVwDKksDBr3/PZ0OOdtYoQksz/QNv/dcccBEkZhIJFmT8FGUDCaY1ZgbdNNl9qLKH/ooly7jPrfreXp/w/JO/O249LiUsPSjldOa4ARCsUCGPGQdLHwtyfc/ODbCe2pfTEnfHpiWPpmJpsFslLxnAn8zxwOPu9zAHLWmDZNF+e5/zdX2pnlQ5BXBmGuwlXIvhrzJ1nIT44mh9mUkuKUs1dItgAgW1ehTsgFVQCWV0UgTJ+vrFCewNgKZarTxAa0QUt72ipGYszrbAzXIj8a6wSZfvQ1AwKAgccdcvegTQcaDABcJ8T/myjDmsDWCaOCBuXQ97D10qVIlSZHoSL5CqAoYqkBZMmCK1WBCpvZmaXrA/q12QA0Td/IJ77xc2iYBERKEl1V7tvYaDgIhPuUutUNQPlmkRzrAgr9AYDfIhqUgtauIWMFFoMRis+nDv3H4iWEUq58zSZY5V9rrLfFTjd87fHe7t1Da74Dn8cX8qX89c85oeXQEMBm5/MWSiVPgbGvih59jTdOa8W35zsZUfxd4GDoYNABsoo53pD+mjv0z1Dn78O/N/3e+DAaADw8fSh4cOZB8r8KCACAQACpAAwAigGUqwPnEMiue5rsP4pICSoladShWpVcebSaxcgQLVmsOJNMMJGaiZHOcO2ydTEYgdRqlDEaNBmpU41aU9VrUa5CsVJlSiCQNYQDAGAaAEAOAOwA1Ftg9hPAGLlXB8Ah0DY+xG3b9Im7xeuEfUvMlsP2uFNK/CBJLNdbjYchzRSf/UOOBN0Sq6GjRml2R+VrTJmaAt0dbwwEz/Y9aczhxhErCaTaQCzSucynO5E3E5/6an+4UafaYXgZxCbaBhLM9FU6oJgbOCL9Swy9I67LfXR+EVzPfrOn3O2zO13cL976wPfurkrSIy0fwh7JxugPmH9OaYpp5UqF42ar9EIw7mvX9jA+OTlEBds7kXleKJvLYWneQitPfOlebFW5dk8RLVlGCPTv9oou8eBWZtJIG/gszOm9ORSLvqFqVoTRvcA20+6WMgxtGja08tjWWL8dch4L5ZTN470Ttuc7fpFHixSXAacpVl++HQTmeuWQofTxjn6rMoVaQrI9JYwLXOk9tgxjPzmU9eGM3ODvNGeTdNim/lKL2GCe9+T2sSMu5XzPeb+4ut3a4DaFbWxs+lpw9KfXhrjdCvmxtmh5LZQqVhmYRw4hc0VlA4uvqhdbJqn0k2ipyhhvjloMtiwzpqEv8lNYoGhVzDDamVXwtwUDMwNfUjLMdNFr5Kw21aHnQKZeUudi1XI3uuSCxGlQLlxNALDQmXE9vsiAmdOQtqX4p4OLUMeA//CM9AE4WZ9reaalIAQXk0EHkQfBImzbGD1Db5YimNAKaKBS2BDrBaXmPasyaCbZpkeWKmaS1UYiySdJ/aaILxcp1glsqPYI3IYYD3G2jpFnKzEHFwF3q7aSEoYNqswz5j1e3xerHeaLCDbCvX3sRImzJjbCX8X2k1H5Ic4YzJYQ54GxyPYbpnN6Hu+Cki3Z/fBMi/jP4RVvi8b8TReHAfj7D/o8YJtWKpYovm03K0nn+W+yJ8VItY0gaXg4YKnFfiequkJsnRn+0I6QXfE//RvJc/T6mRmU8ion18UZi7zlupQbltqV73+4qUX79KT/mQywVWYcjhuuNpvx5mhwc37DTt7w3+47eVfT7XUsOofdt9Zt7EG6tzuLo/ldsd78m+e6Op6CTLZPPRPOWtP/joEG1EDHQqK3GlO/Pq3L8am7YePP7RG/0k/4HCbSXJSyTita5DWeFs/pcYRNniltD2Jlq9nfzuxCPMrcsO60VGrixzXB00N/XVdx5xGDvGnSmmwY0m4uszPNyv9hdoF9ntblqkNDTgHQ9h5VKdBVhlYxxZYetAnpcMrB/rmgKxVcR3H5Q2bERhBpiBK3Bbyn51gXXuLFFkRhoZbe6vkgUklHE/XM2cyIhXsx9Zmej+qHYDknaS7GEc6f9rBPSI6nR84hq2Qbiuuqw206bmBomXo8iCaVC7jAkgixXM4+EmJQc0rUx2ilHUo4bO/hRL4k7mPjR67pZecGMelusq/bpY6gqSkHCrKxhuWb0belyNb9iFfeT4p+ze+WWd+VT6xpacHuYT8F+1oKVq78vMMf5l2JOenslbE3Q6K9kQFeE9LluAgazJPnOQ/juWifMI++42m/pHnMde89ZXbwEZRSoqKb1KiGSV6OCWJ5htFJqEJnB1T3fRqj4YyKfPrY9evVMpYCilGhV/nPrxwKeYrFPrKZihgHqOaPh64SJKxt30IFw27CiktSvVpfD3JQ8iQLinALj3GOPBFOvneR2t+xM99ma0YxRrJPcdlboX9zjxh5RSL4RhLQ0n9EnBgSE6xtDFawJmL858ojx5xX0awzS8wIQ5cDbpxJZz/jwQomaTb8HslwvGQjwmIlL0LVv09+/A3R6DXm0bhOkqFM62HCGafc/7ZFplG6ZBkPDeZ1o7IYqw0n8jPZ9aOg3cbASJ6UZjfnz09ja5rTKjaUYb/xy+5+a3a7J1mXfPNbjFmihWKYaU7i7gd+vPsuNB497oSTC7hcfBGsRVJDX0qFbn6Lz7m7W3mu4f0RXY3ilqoDtXMrOf2wgk5ivIln37G/KVL8konuT3qPPrcrNnQyW+T0ZgELAmkGT2/305t9Illad7Y3Qd5zoz/+y1MUJVsDmw0JDDuTEeWaVAyK8ZkDRNFP8/czMkiU4Vbv6J9tIII6wYFq45Tm9uqUZXS6PHQR/HLOQ5bW5dqOOt+5PrdpSs+OLP7l4Gy0YTzMZFiLFRJVlKv0wbuYiHuvLViqKEu2jQR2/P0OYiLeDr38QQLe8LE+ISKuIATUdKnu0uutQprRxt05+eANwp1GQjte5Gi9TJUd8vRIuPXSsizb3CXFC4NWxFr9h2j8aTFiqKDVS8KMuFmvnLvailDz+eY/f3qxtkExS+ixM1vpxzaw3USJSTIGCcU0sUd2lsST88CIC1mztWKXdwF8xmq4bdYan+5VtFBsdzO9lx8VqLTK/RGgSH1gLrLMigT7+xs5BLmeYzZA4mZ713JoZC/H2r93nlKc0RQAqcHmefEhxDpBeGOIq8Sau87qeg3jtXjvax9sNJyafd9vkbCLpDmnnvdxlZLMsh15TCi/5Vyba+9c6/eaZHhPIxnQ+iG/KEpZUNSz30M/LlbUTBKShSZotzRYzejMs7qx6v/rEH3qoDL672Xnt8JMGsnMyDOYwUwxSchW9d0KvRy6x3oliVkWd4uRMAOCRnRJYLXUPP2qwE1KsnwSytw8qyy74Rq/2rrfLvO0hsWiN1VEMthU2890mBlAYsLksUGRwS7fYsyCrHIfe9uuf+gB92xIXPTBwpP496gFQb63Wcf4nt8YWQCJGJtNomjzkypZJm0s3QN01s7+FoafXuqJCsVI9sGBSHuctLGmVSs9hLHjbkFine3/R4Lsc16rLOyZR1mE8RqbXk7SiJyHHNwADtyqyDC/fLu5JGaV/UNmHWgkbOLSfeG3IJW54FWOY/OMPwWaQGDGZsGqvmyXUUEl/2egZU+mWqYqtlemQ9EtiEj4dWDwtTLqzaNNHSGJAzP2bVPG9K/5sANS3RPC+s72nU0IW77/6Pv4MChgyrS+plAJwzDb0zlJkONrTxjBC7kU4lKnvDg8zA4iD5QWe8Idihf8Z5mDe5T82+yd+H3XZ4hz4mvnndg673RnoOpdz+f/zoZULFrmScuBvRY7jRZZM7OK/jGPZecSpwvkjJxTkVbxjnd+R0yZioDFZvMjOThnbyNRegZNd9p2KJjKb82l8pt6KGguvDV7UWmRPVBkvDNG7hXoWzcpN11xpVUxOF4J/7Ibu8tc3fUSK1Ra0r0aK5anB7d/OP0aXtFS+b8ceyREzlM5HWZZ5GVYxNh/vrGaFi2a+Kp7AXdl57vNSNTDRXciFzeMqdLn/EQHA5aUDsyACLM0/h93Rlh9z4NiYapN+5veF5OGa0/AfOFohWvjaDnUtceKQ8r1juuzqIKh91UFU4VUcvA02xB3cWrA5pBxU3NN/Y9Oj3SHhYs3baMmHJ/M6bEa7G7U49/g5csDg5fBDfZupWrn7gjIdG3KH53vadSOCxGo4z1AR+sAbW4MEcaPCspPhvfBZr1GgEkxEFU6jFpyCqxqktnmRgPoq7iz4jFcZ6Dajk9mWVb0MYlSHU7Nrafh+qX9h4CxegsT0qMTnT8lqXnwPPqjVs37lARf0iXpdF1KA8vWBdUxXC9VUFN6/+EeZbV8PGiTAuQTQH+UAanwVyWIFupR8FsMwtIlbbFvjcpP/0zXTW2IfJr4clIthJRqDvjADhBFh0NNMTKeAoio25Ad7/CySIwnlA+zuFFgVPDVCS7m1yKZyGKnd/O1QK8TxtcH2J97urFvH3IxReCYWO3agdy545w0zP5aNlDwnW4mHJeFdxwdOen0EP0/lp1wl6W9B37se9kJbxn8KWm/35j1I0Xqto4uuw/8kMGmlvsNfiDb3WCLG0y10ng+0axV8yOmvqkM1nhd00yPF4dW74EqG+xk4VPuKGK0no+eLI+ThFbtufvwOgK+ltaQw+FasHSYWndTDzf3w6UJzjX9/+CuUGWQpSj92fONg2IfF3+u/NDYYxST+8nMvPFZG7B2D3c9YXmzROn66JvrsYU8FzvvozqXxItpM243+eDJjbLQBmjIeiP/Hr58Q3f16vHsiRVEeKR53Jl/59S13I+Vdb/cO4e3dap6kozoqljYfM3N6sluF1V9b+vEMmg/HmFw77yYViDAeptp62M5qf5iZh/RUUwh93v2ZT926io37qprMkYa6LMxxS4RYftnvKMWWfV0ftFoYxS54wSYppJgpXVTYVqm7dKRXHvdLJGFfZ+WRaSTbHp5Go3IKcfx1FJKGiHz7WsL7Q7dY+2ThllCkhi5kYqgt5US4HwxReQLm0wBBTUelnjNM33iYClb+yhOaKFcH0PMhSRYoSIxVKQzYpC2nD3SIAx8EQtrZ4bdgF1IZHaeBdGix2jTsi3YBp05Y1WDrkR2WtIX6vR16eJLRZcTGWZ7YZznl6qOMr+CtaGT2he1dPDPPntbN+1JddfA4IBg5pyulrZhezVtW4R696xO/65+fkMTrxeSuFi6DqOozgqYuvtiovOm5EzjwcIKOp6jx/C8RUyqbgGTNqvNBrtu1qHeab49bUo6seAj1VRijmpgLiuKbkjBUZ2Bmqvx72wmlTNfHerBJBlSIm0nm5JylJXTz6Kk7GdFpTrTSRjgzXRl6rSE2fx4FNVFUzwLDxY+c6bqzjmqp/NuMygpN+jsWe/soZ/dtz0monfbsGISkLx2OqqbwkA/vkYj4m5/obTTKSlT6ZBzhfk9hcL8+JSF6d+xGCf1KP3gaxamA+FBTO/Kx3RAHDsya2jv1Lbpx7rnHJjupdzV9ffmHZA8ukwkLi0T6Z2Ddfz5Ye+BQIczgjI7mQ/wDyXGXxonW+1c6ZhY342pYbQxdy4lvvawOE64hDUCqoMYZ16zqERw4vcs+iE5buLApk/6ZrVmSlb8oH5WhCR+eSyEx6dQ0FWn5/MksQTnd2e81Fi3W6Jj5Y3Vj6AxTeV5Y5HSsz+8I2FH3BHawuaoZTXC7CshaW8O2HhYda+a5u7NO7XLO5/OKY+zhexIk1RWZZLcMtFPEDxN+1acNFgMVimLd6qxCVsTHfNnN/0D7K1570HapC3UG9QaU1b8Mr0xQhJfFQv+wxNorLhY+tABeiTaIEI0QK7timP2KANlGoCCKAlR0EYqG1gbFaKgLQMS6okr1CnkWB8U09HR5BvdqaVCDADphhLdlx3GIOzC5OStKw5lm1XWu10fqwl6ZJ0e3nh3CNWut8Mdy8Ss96Meh051fOKHDtZrrIuW0YL0PDkEACrq77qws8M54f+NQnkJAK58cXAAAM++P9g6dGqVb9jObABUKAAABDxJzbGnKt3OurY8XMi0ZqsZLlGvUw0VfAeJgp5qXmhe9JXKB+G5wyENvAZetkwe/U3eq8LroDiY8XsNP+Fi3DrVS2sxAd4/IZ7gNAsTn4jax0NnPjKN5pOIDLmLUUfyBhv3Vrw/12D9yH2v4zGhfhjTR32IF8/8NbUckINXrXBl3TvaMBoj//GKNfsS4TGtT62Hd66I87jtN7EDNz/whsNEjVnoB2go9H6A5ylrOuAl3mSQR1lyaj2eRcmKwrTlvMqtEw7WtgZx3uk1HJeplsYoUxFLeBVBrlh5RY6LnpDCJTMeDQ8/14tQQRUjDN2bxUQhgcS/LTukfhbVh5uWfcdP4gWeJry+5du+bD4mbzZ8tx7HFcCH5YQX6+629bZurOuvkVyYpAKMmvBMO9a0oZE8V4fLWdxO4l0ipJDnhLhH4SZvvfVQCiKjKB1D7D8MAmCauSxI4RCTRrEnaUpNG2zQAWAgMA5B2Hs5BMV2ewhFuBVDMHKNQ3AODEOopAKRLQKg3KhnxDojhfLCWhUlapQq1lSWmFQocsGRN3oO7whlckXTPU4tjQYFHKqt8JCKZQiavGKETBzRp1XE5eTz5cn72d0Hvyd/nAJ/cwSG+eIcsaJNO859S9v2cdSiU4xNDLNCmTZMPt8Wg1eYjtCS7ZQX9Z1Grcq1VrRFVRWyWa425cfmk2vYLFMRAniikKci16pdIWPtmG1SonsciZvNikaQmR6qOFPTXAXUYbpDy8DXizcNgJiElIycgis37jx48uLNhy8//gIEChIsRKgw4YaJEStOvARqiTS0kiTT0b8g+PeRLkOmLNly5MpjQLJizYYtO/a4HDhyQgmKUBAMLHA441kHI3REFxYqS5HBESpCIDSEDub6bRUVBphhMsoXQRkzhImwEDYcdcw22+2wE45BhG6qKaZpM9xL7fYhwoEOC7B98NEufAIu5irwNxWaGaLddM8tt7cbPld4e6u80ehnWPJLrdY+Py7Wx48GQ4IBwcCAf7GfT8g/6Bv00/2xLxdJ3ZWhjs1MBw==)
		format("woff2");
	font-weight: 400;
	font-display: fallback;
	unicode-range:
		U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308,
		U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "站酷回退";
	src:
		local("Microsoft YaHei"), local("Microsoft YaHei UI"), local("PingFang SC"),
		local("Hiragino Sans GB"), local("Noto Sans CJK SC"), local("Noto Sans SC"),
		local("Source Han Sans SC"), local("WenQuanYi Micro Hei");
	font-weight: 400;
	size-adjust: 92.6%;
	ascent-override: 95.03%;
	descent-override: 12.96%;
	line-gap-override: 0%;
	unicode-range:
		U+2E80-2EFF, U+3000-303F, U+3400-4DBF, U+4E00-9FFF, U+F900-FAFF, U+FE30-FE4F, U+FF00-FFEF;
}
@font-face {
	font-family: "等宽回退";
	src:
		local("Consolas"), local("Menlo"), local("DejaVu Sans Mono"), local("Liberation Mono"),
		local("Noto Sans Mono"), local("Courier New");
	font-weight: 400;
	size-adjust: 99.7%;
	ascent-override: 98.7%;
	descent-override: 27.38%;
	line-gap-override: 0%;
}

/* ==================== 延后显示元素/本来就需要隐藏的元素 ==================== */
main > #分界线 {
	visibility: hidden;
}
.进度条外面,
.标签 > div,
div#侧边按钮容器,
section#我 > br {
	display: none;
}

/* ==================== @keyframes ==================== */
@keyframes 标记 {
	0% {
		background-color: mark;
		color: marktext;
	}
	75% {
		background-color: mark;
		color: marktext;
	}
	100% {
		background-color: inherit;
		color: inherit;
	}
}

/* ==================== @media ==================== */
:root {
	--bg-color: #f7f7f7;
	--surface-1: #ffffff;
	--surface-2: #f2f2f2;
	--text-color: #222;
	--overlay-soft: #8881;
	--overlay: #8885;
	--overlay-strong: #888;
	--selection-bg: #0006;
	color-scheme: light;
}
@media (prefers-color-scheme: dark) {
	:root {
		--bg-color: #18171c;
		--surface-1: #222027;
		--surface-2: #2a2931;
		--text-color: #ccc;
		--overlay-soft: #3333;
		--overlay: #fff2;
		--overlay-strong: #888;
		--selection-bg: #fff5;
		color-scheme: dark;
	}
}
:root.深色 {
	--bg-color: #18171c;
	--surface-1: #222027;
	--surface-2: #2a2931;
	--text-color: #ccc;
	--overlay-soft: #3333;
	--overlay: #fff2;
	--overlay-strong: #888;
	--selection-bg: #fff5;
	color-scheme: dark;
}
:root.浅色 {
	--bg-color: #f7f7f7;
	--surface-1: #ffffff;
	--surface-2: #f2f2f2;
	--text-color: #222;
	--overlay-soft: #8881;
	--overlay: #8885;
	--overlay-strong: #888;
	--selection-bg: #0006;
	color-scheme: light;
}
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		transition-delay: 0ms !important;
	}
	html {
		scroll-behavior: auto !important;
	}
}

/* ==================== ::* ==================== */
/* ::-webkit-scrollbar 会频繁重绘，新浏览器改由标准属性，
旧 Chrome 回退 */
html {
	scrollbar-color: var(--overlay) transparent;
}
::-webkit-scrollbar {
	background-color: transparent;
	width: 8px;
	height: 8px;
}
::-webkit-scrollbar-thumb {
	background-color: var(--overlay);
	border-radius: var(--border-radius);
}
::-webkit-scrollbar-corner {
	background-color: transparent;
}

/* ==================== html/body/通用元素 ==================== */
:root {
	--border-width: 1px;
	--border-style: solid;
	--border-color: var(--overlay-soft);
	--border-color-strong: var(--overlay-strong);
	--border: var(--border-width) var(--border-style) var(--border-color);
	--border-strong: var(--border-width) var(--border-style) var(--border-color-strong);
	--border-radius: 12px;
	--box-shadow-color: rgba(0, 0, 0, var(--accent-color-opacity));
	--box-shadow: var(--box-shadow-color) 0px 0px 12px 0px;
	--box-shadow-strong: var(--box-shadow-color) 0px 4px 16px 8px;
	--bg-height: min(33vmin, 420px);
	--bg-top: 112px;
	--footer-margin-top: 32px;
	--line-height: 1.6;
	--main-top: 80px;
	--right-shift: 512px;
	--transition: 0.3s;
	--transition-slow: 1s;
}
html {
	/* 中性缺省强调色 */
	--accent-color: var(--text-color);
	--accent-color-transparent: var(--overlay);
	--accent-color-opacity: 0.18;
	--accent-text-color: var(--bg-color);
	--link-color: var(--text-color);
	scroll-behavior: smooth;
}
body {
	background-color: var(--bg-color);
	color: var(--text-color);
	display: flex;
	flex-direction: column;
	align-items: center;
	font-family: "站酷拉丁", "ZCOOL KuaiLe", "站酷回退", sans-serif;
	font-weight: 400;
	line-height: var(--line-height);
	margin: 0;
	padding: 0;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

a,
svg {
	color: var(--link-color);
}
a {
	text-decoration: none;
}
a.无滤镜,
a.无滤镜:hover,
a.无滤镜:focus-visible {
	text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 400;
	margin-left: 8px;
	padding: 0 4px;
	position: relative;
}

img,
video {
	background-color: var(--bg-color);
	border-radius: var(--border-radius);
}

x-spoiler {
	background-color: #000;
	color: #000;
	transition: var(--transition) color;
}
x-spoiler:hover,
x-spoiler:focus-visible {
	color: #fff;
}

svg[data-icon] {
	background-color: var(--bg-color);
	border-radius: 50%;
}

section,
article {
	background-color: var(--surface-1);
	border: var(--border);
	border-radius: var(--border-radius);
	box-shadow: var(--box-shadow);
	margin: 0 8px 8px 8px;
	padding: 12px;
	word-break: break-word;
}
section > :is(section, article),
article > :is(section, article) {
	margin: 0 -4px 8px -4px;
	padding: 12px;
}

section h2 svg,
article h2 svg {
	margin: 0 8px 0px -5px;
}
section img,
section video,
article img,
article video {
	max-width: 100%;
	height: auto;
}

section > h2:first-child,
article > h2:first-child {
	margin-top: 8px;
}

/* 不支持 :has/is() 的浏览器（如 Chrome 86）会整条规则失效，故需 @supports 兜底副本 */
/* 但此类样式无替代方案，故不使用 @supports */
:is(section, article) :is(h1, h2, h3, h4, h5, h6) {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	position: relative;
}
:is(section, article) :is(h1, h2, h3, h4, h5, h6)::before {
	content: "";
	border-radius: var(--border-radius);
	display: block;
	position: absolute;
}
main > .右 :where(h1, h2, h3, h4, h5, h6)::before {
	background-color: var(--accent-color);
	/* 用 opacity 而非 bgc:act 减少重绘量 */
	opacity: var(--accent-color-opacity);
	width: 4px;
	height: 100%;
	left: -8px;
	transition: opacity var(--transition);
}
:is(h1, h2, h3, h4, h5, h6).含图标::before {
	background: linear-gradient(to right, var(--accent-color), var(--accent-color-transparent));
	opacity: 1;
	width: 5em;
	max-width: 50%;
	height: 4px;
	bottom: -0.3em;
	left: 0;
}

blockquote {
	background-color: var(--surface-2);
	border: 1px solid var(--accent-color-transparent);
	border-left: 4px solid var(--accent-color-transparent);
	border-radius: var(--border-radius);
	margin: 4px 0;
	padding: 0 8px;
}
code {
	background-color: var(--overlay);
	border: 1px solid transparent;
	border-radius: 6px;
	font-family: "Source Code Pro", "等宽回退", monospace;
}
pre {
	background-color: transparent;
	color: var(--text-color);
	border: var(--border);
	border-radius: var(--border-radius);
	overflow: auto;
	padding: 0;
}
pre > code {
	display: block;
	background-color: transparent;
	border: none;
	margin: 0;
	padding: 1em;
}
pre code.hljs {
	display: block;
	overflow-x: auto;
	padding: 1em;
	position: relative;
}
code.hljs {
	padding: 3px 5px;
}

hr {
	border-color: var(--overlay);
}

table {
	border: var(--border);
	border-collapse: separate;
	border-radius: var(--border-radius);
	border-spacing: 0;
	margin: 4px 0;
	max-width: 100%;
	overflow: hidden;
}
th,
td {
	border-right: var(--border);
	border-bottom: var(--border);
	padding: 4px 8px;
}
tr > :last-child {
	border-right: none;
}
tr:last-child > * {
	border-bottom: none;
}
th {
	background-color: var(--overlay);
}

input {
	accent-color: var(--accent-color);
}

/* ==================== 通用工具类 class ==================== */
.隐藏链接,
.隐藏文字 {
	background-color: #000;
	color: #fff;
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	overflow: hidden;
}

.标记 {
	animation-duration: 3s;
	animation-name: 标记;
	animation-iteration-count: 1;
	animation-timing-function: linear;
	transition:
		var(--transition) color,
		var(--transition) background-color;
}

.淡化 {
	opacity: 0.7;
}

.元数据 {
	display: block;
	width: 100%;
	border-top: 2px var(--border-style) var(--overlay);
	font-style: italic;
	margin-top: 8px;
	padding-top: 8px;
}

.头像 {
	border-radius: 50%;
}

.特小尺寸,
.小尺寸,
.中尺寸,
.大尺寸 {
	width: var(--width);
	height: var(--height);
	max-width: 100%;
	max-height: 100%;
}
img:is(.特小尺寸, .小尺寸, .中尺寸, .大尺寸) {
	max-width: unset;
	max-height: unset;
}
.特小尺寸 {
	--width: 24px;
	--height: 24px;
}
.小尺寸 {
	--width: 32px;
	--height: 32px;
}
.中尺寸 {
	--width: 48px;
	--height: 48px;
}
.大尺寸 {
	--width: 128px;
	--height: 128px;
}

.fill {
	fill: var(--link-color);
}
.stroke {
	stroke: var(--link-color);
}

/* ==================== 导航栏、左右栏 ==================== */
@media only screen and (max-width: 435px) {
	#导航栏 > .右 > a svg {
		display: none;
	}
}

/* ==================== 导航栏、进度条、顶部大图 ==================== */
nav#导航栏 {
	background-color: var(--overlay-soft);
	box-sizing: border-box;
	border: var(--border);
	border-radius: var(--border-radius);
	color: var(--text-color);
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: space-around;
	flex-wrap: wrap;
	overflow: overlay;
	position: sticky;
	top: 7px;
	height: 48px;
	z-index: 998;
	transform: translateY(0);
}
@media (max-height: 240px) {
	nav#导航栏 {
		position: relative;
	}
}
#导航栏 > .左,
#导航栏 > .右 {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}
#导航栏 > .左 > a,
#导航栏 > .右 > a {
	margin: 0 8px;
}
nav#导航栏 a {
	color: var(--text-color);
	display: flex;
	align-items: center;
	text-decoration: none;
	word-break: keep-all;
}
#导航栏 > .左 > .标题 {
	font-size: x-large;
	font-weight: 600;
}
nav#导航栏,
body > #顶部大图 {
	width: calc(100% - 90px - 18px);
	max-width: calc(1600px - 16px);
}

body > #顶部大图 {
	background-color: var(--bg-color);
	border-radius: var(--border-radius);
	display: block;
	height: var(--bg-height);
	overflow: hidden;
	position: relative;
	z-index: 0;
	margin-top: 64px;
}

#顶部大图 > .顶部大图层 {
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	position: absolute;
	transition: var(--transition) opacity;
}
/* 最底下的基线层无变化。始终不透明且不参与过渡，作为兜底与背景，新层直接在其上淡入，
   避免首屏就存在的 .显示 层被重新赋值为透明 */
#顶部大图 > .顶部大图层:first-child {
	opacity: 1;
	transition: none;
}
#顶部大图 > .顶部大图层 > img {
	display: block;
	object-fit: cover;
	user-select: none;
	height: auto;
	min-height: 100%;
	width: 100%;
}
#顶部大图 > .顶部大图层.显示 {
	opacity: 1;
}

/* ==================== main、左右栏 ==================== */
main {
	--main-maxw: 1800px;
	--left-maxw: 420px;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	width: 100%;
	max-width: var(--main-maxw);
}
main > .左,
main > .右 {
	overflow-y: auto;
	scrollbar-gutter: stable both-edges;
	padding-top: var(--main-top);
	padding-bottom: 4px;
	padding-left: 4px;
	padding-right: 4px;
}

main > .左 {
	--maxh: calc(100vh - 16px * 1);
	border-radius: var(--border-radius);
	position: sticky;
	top: 0;
	width: 50%;
	min-width: var(--left-minw);
	max-width: var(--left-maxw);
	max-height: var(--maxh);
}

main > .右 {
	width: 100%;
	max-width: calc(var(--main-maxw) - var(--left-maxw));
	min-height: 100vh;
	padding-bottom: 16px;
}

main > #分界线 {
	--border-width: 16px;
	--margin-x: calc((var(--border-width) * 2 + var(--width) - 24px) * -0.5);
	--width: 4px;
	border: var(--border-width) solid var(--bg-color);
	border: var(--border-width) solid transparent;
	box-sizing: content-box;
	margin-top: var(--main-top);
	margin-left: var(--margin-x);
	margin-right: var(--margin-x);
	position: sticky;
	top: 0;
	width: var(--width);
}
main > #分界线 > .特小尺寸 {
	max-width: var(--width);
	max-height: var(--height);
	position: absolute;
}
main > #分界线::after {
	content: "";
	background-color: var(--surface-1);
	border-radius: var(--border-radius);
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
}

/* ==================== 左栏 ==================== */
.左 > section#我 {
	display: flex;
	flex-direction: column;
	align-items: center;
}

section#我 > .头像 {
	margin-bottom: -64px;
	position: relative;
	top: -64px;
	max-width: unset;
	max-height: unset;
}
section#我 > h2 {
	margin: 0.25em 0;
}
section#我 > #联系方式 {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0 -8px;
}
section#我 > #联系方式 > a {
	display: flex;
	margin: 0 4px;
}
.rss {
	transform: translate(-4px, 2px) rotate(45deg);
}

section#我 > #关注被关注码龄 {
	font-size: smaller;
	margin: 0 0 1em;
}

#一言 .语句 {
	text-decoration: underline wavy var(--accent-color);
	text-underline-offset: 2px;
	text-align: center;
	overflow-y: auto;
	height: calc(var(--line-height) * 2em);
	margin-top: 2em;
}
#一言 .作者 {
	opacity: 0.7;
	text-align: end;
	padding-top: 4px;
}
#一言 .作者,
#一言 .语句 {
	display: block;
}

/* ==================== 页脚 ==================== */

footer#copyright {
	background-color: var(--surface-1);
	border-top: 1px solid transparent;
	border-radius: var(--border-radius) var(--border-radius) 0 0;
	padding: 16px 0;
	margin: 32px 0 0;
	text-align: center;
	width: 100%;
	z-index: 1;
	overflow-x: auto;
}

/* ==================== 移动端 ==================== */
/* 该数值同时存在于 main.js */
@media only screen and (max-width: 840px) {
	:root {
		--bg-top: 62px;
		--bg-height: calc(min(calc(64vh), 420px));
	}
	nav#导航栏 {
		width: calc(100% - 18px);
	}
	body > #顶部大图 {
		margin-top: var(--bg-top);
		position: fixed;
		width: 100%;
		height: var(--bg-height);
		z-index: -1;
	}
	main {
		flex-direction: column;
		padding-left: 0;
		padding-right: 0;
		width: 100%;
	}
	main > .左,
	main > .右 {
		--left-height: var(--bg-height);
		--left-maxw: 540px;
		--left-minw: 320px;
		display: block;
		width: 100%;
		min-width: unset;
		max-width: unset;
	}
	main .左 {
		--margin-x: max(8px, calc((100% - var(--left-maxw)) / 2));
		height: var(--left-height);
		padding: var(--bg-top) 0 0;
		top: var(--bg-top);
		z-index: 0;
	}
	main > .左 > section:last-child,
	main > .左 > article:last-child {
		margin-bottom: calc(var(--left-height) - 32px);
	}
	body > #顶部大图,
	body > #顶部大图 > .顶部大图层 > img,
	main .左,
	main > .右::before {
		border-radius: var(--border-radius) var(--border-radius) 0 0;
	}
	main .左 > section {
		margin-left: var(--margin-x);
		margin-right: var(--margin-x);
	}
	main > #分界线 {
		display: none !important;
	}
	main > .右 {
		background-color: var(--bg-color);
		border-radius: var(--border-radius) var(--border-radius) 0 0;
		z-index: 1;
		position: relative;
		margin-top: 0;
		padding-top: var(--border-radius);
		padding-left: 0;
		padding-right: 0;
		overflow-y: unset;
	}

	main > .右::before,
	main > .右::after {
		content: "";
		background-color: var(--bg-color);
		display: block;
		position: absolute;
		left: 0;
		width: 100%;
	}
	main > .右::before {
		box-shadow: var(--box-shadow-strong);
		height: var(--right-shift);
		top: 0;
		z-index: -1;
	}
	main > .右::after {
		height: calc(100vh - var(--right-shift));
		top: calc(var(--right-shift) * 0.5);
		z-index: -1;
	}

	@supports (animation-timeline: scroll()) {
		main > .右 {
			background-color: transparent;
		}
	}
}

/* ==================== 网易云音乐小组件 ==================== */
/* 骨架在 light DOM，此处仅占位 */
x-163music {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 64px;
}