body.mirror-page { padding: 10px 8px 12px; background: var(--xp-bg); }
.article-tools { position: absolute; top: 29px; right: max(15px, calc((100% - 682px) / 2)); z-index: 2; display: flex; gap: 4px; }.article-tools .quiet-button { display: grid; place-items: center; min-width: 36px; min-height: 36px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--xp-muted); }.article-tools .quiet-button:hover { background: var(--xp-soft); color: var(--xp-text); }.article-tools .quiet-button span { font: 21px/1 Arial, sans-serif; }.article-tools .article-lang { display: none; }
.container { max-width: 770px; margin: 0 auto; }.post { position: relative; padding: 28px 44px 30px; border: 1px solid var(--xp-line); border-radius: 4px; background: var(--xp-paper); color: var(--xp-text); }
.article-byline { display: flex; align-items: center; gap: 11px; padding-right: 48px; margin-bottom: 21px; }.article-byline .avatar { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 50%; object-fit: cover; background: var(--xp-soft); }.article-byline .author-info { min-width: 0; flex: 1; }.author-name { font-size: 13px; font-weight: 600; }.author-handle { margin-top: 4px; color: var(--xp-muted); font-size: 12px; }
.translate-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 11px 0; border-top: 1px solid var(--xp-line); color: var(--xp-muted); }.translate-btn { min-height: 36px; padding: 8px 12px; border: 1px solid var(--xp-line); border-radius: 7px; background: var(--xp-soft); color: var(--xp-text); font-size: 12px; transition: border-color .15s, color .15s; }.translate-btn:hover:not(:disabled) { border-color: var(--xp-blue); color: var(--xp-blue); }.translate-btn.is-loading::before { content: ""; display: inline-block; width: 12px; height: 12px; margin-right: 6px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; vertical-align: -2px; animation: xp-spin .7s linear infinite; }.translate-status { color: var(--xp-muted); font-size: 12px; }.translate-status.is-error { color: var(--error-color); }.translate-retry { padding: 5px 2px; border: 0; background: transparent; color: var(--xp-blue); font-size: 12px; }.translation-pending { color: var(--xp-muted); font-size: .72em; font-weight: 500; }
.content { color: var(--xp-text); font-size: 16px; line-height: 2; letter-spacing: .15px; overflow-wrap: anywhere; }.content-view { display: none; }.content-view.active { display: block; }.content p { margin: 23px 0; }.content h1 { margin: 21px 0 23px; font: 600 26px/1.55 "Songti SC", "Noto Serif CJK SC", "SimSun", serif; }.content h2 { margin: 31px 0 13px; font-size: 19px; font-weight: 550; line-height: 1.7; }.content strong { font-weight: 600; }.content a { color: var(--xp-blue); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--xp-blue) 35%, transparent); text-underline-offset: 4px; }.content a:hover { text-decoration-color: var(--xp-blue); }.content img, .content video, .media-img { max-width: 100%; margin: 13px 0; border: 1px solid var(--xp-line); border-radius: 8px; }.content blockquote { margin: 28px 0; padding: 4px 0 4px 20px; border-left: 2px solid var(--xp-blue); color: var(--xp-muted); font-size: 16px; line-height: 2; }
.video-placeholder { margin: 13px 0; padding: 20px 17px; border: 1px solid var(--xp-line); border-radius: 8px; background: var(--xp-soft); color: var(--xp-muted); }.video-placeholder-title { margin-bottom: 14px; color: var(--xp-text); font-weight: 600; }.video-progress { height: 7px; overflow: hidden; border-radius: 999px; background: var(--xp-line); }.video-progress-bar { height: 100%; background: linear-gradient(90deg, var(--xp-blue), var(--xp-button)); transition: width .4s ease; }.video-progress-text { margin-top: 9px; font-size: 13px; }.video-placeholder-error { color: var(--error-color); }.subtitle-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 8px; color: var(--xp-muted); font-size: 13px; }.subtitle-select { padding: 6px 28px 6px 10px; border: 1px solid var(--xp-line); border-radius: 7px; background: var(--xp-paper); color: var(--xp-text); }
.article-end { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 34px; padding-top: 17px; border-top: 1px solid var(--xp-line); color: var(--xp-muted); font-size: 11px; }.article-end a { padding: 5px 0; color: var(--xp-muted); font-size: 12px; }.article-end a:hover { color: var(--xp-blue); }.back-home { border: 0; background: none; }.article-time { color: inherit; font-size: inherit; font-variant-numeric: tabular-nums; white-space: nowrap; }.saved-mark { display: flex; align-items: center; gap: 8px; white-space: nowrap; }.saved-mark::before { content: ""; display: block; width: 12px; height: 6px; border: 1.5px solid var(--xp-muted); border-top: 0; border-radius: 0 0 2px 2px; }.article-end .source { color: var(--xp-blue); }
@media (max-width: 740px) { body.mirror-page { padding: 10px 0 12px; }.container { margin: 0; }.post { padding: 30px 25px; }.article-tools { right: 25px; top: 29px; }.content h1 { font-size: 24px; } }
@media (max-width: 430px) { body.mirror-page { padding: 10px 8px 12px; }.post { padding: 28px 19px 24px; }.article-tools { right: 15px; top: 25px; }.article-byline { padding-right: 0; }.content h1 { margin: 19px 0 21px; font-size: 22px; line-height: 1.6; }.content { font-size: 16px; line-height: 1.95; }.content blockquote { margin: 25px 0; }.article-end { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 8px; font-size: 11px; }.article-end .back-home { justify-self: start; }.article-end .saved-mark { justify-self: center; }.article-end .source { justify-self: end; margin-left: 0; } }

.content img { height: auto; }
.archive-title { font: 600 26px/1.55 "Songti SC",serif; overflow-wrap:anywhere; margin:20px 0; }
.post-published,.archive-navigation { font-size:12px;color:var(--xp-muted);line-height:1.7; }
.archive-navigation { display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:24px; }
.archive-navigation a,.related-posts a { color:var(--xp-blue); }
.related-posts { margin-top:24px;padding-top:16px;border-top:1px solid var(--xp-line);font-size:14px;line-height:1.8; }
.related-posts h2 { font-size:16px; }
@media(max-width:430px) { .archive-title { font-size:22px; } }
