/**
 * X-Tweet Theme v4.0 — Polished Stylesheet
 */

/* ── 滚动条 ── */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#cfd9de;border-radius:3px}
.dark ::-webkit-scrollbar-thumb{background:#3e4144}
::-webkit-scrollbar-thumb:hover{background:#8b98a5}
.dark ::-webkit-scrollbar-thumb:hover{background:#565a5e}

/* ── 选中文字 ── */
::selection{background:rgba(29,155,240,.25);color:inherit}

/* ── 毛玻璃顶栏 ── */
@supports(backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px)){
    .backdrop-blur-xl{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
}

/* ── 阅读进度条 ── */
#reading-progress{position:fixed;top:0;left:0;height:2.5px;background:linear-gradient(90deg,#1d9bf0,#1d9bf0);z-index:999;border-radius:0 2px 2px 0;transition:width .12s linear;box-shadow:0 0 6px rgba(29,155,240,.35)}

/* ── 代码复制按钮 ── */
.code-copy-btn{position:absolute;top:8px;right:8px;display:flex;align-items:center;gap:4px;padding:4px 10px;background:rgba(128,128,128,.08);border:1px solid rgba(128,128,128,.15);border-radius:6px;color:#536471;font-size:.75rem;cursor:pointer;transition:all .2s ease;opacity:0}
pre:hover .code-copy-btn{opacity:1}
.dark .code-copy-btn{color:#71767b}
.code-copy-btn:hover{background:rgba(128,128,128,.18);color:#0f1419}
.dark .code-copy-btn:hover{color:#e7e9ea}

/* ── 图片灯箱动画 ── */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes scaleIn{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}

/* ── Toast ── */
.x-toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);padding:10px 24px;border-radius:9999px;color:#fff;font-size:.875rem;font-weight:600;z-index:400;opacity:0;transition:opacity .3s ease,transform .3s ease;box-shadow:0 6px 24px rgba(0,0,0,.15);white-space:nowrap;pointer-events:none}
.x-toast.show{opacity:1;transform:translateX(-50%) translateY(-4px)}

/* ── 点赞动画（Lucide 兼容） ── */
.liked i[data-lucide="heart"]{color:#f91880!important}
.liked{color:#f91880!important}
@keyframes heartBeat{0%,100%{transform:scale(1)}25%{transform:scale(1.3)}50%{transform:scale(.95)}}
.liked i[data-lucide="heart"]{animation:heartBeat .4s ease}

/* ── 文章卡片入场 ── */
@keyframes cardIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
#article-list > article{animation:cardIn .35s ease backwards}
#article-list > article:nth-child(1){animation-delay:.02s}
#article-list > article:nth-child(2){animation-delay:.06s}
#article-list > article:nth-child(3){animation-delay:.1s}
#article-list > article:nth-child(4){animation-delay:.14s}
#article-list > article:nth-child(5){animation-delay:.18s}
#article-list > article:nth-child(n+6){animation-delay:.22s}

/* ── 图片渐显 ── */
img[loading="lazy"]{opacity:0;transition:opacity .4s ease}
img[loading="lazy"].loaded{opacity:1}

/* ── TOC ── */
.x-toc{margin:16px;padding:16px;background:#f7f9f9;border-radius:16px;border:1px solid #eff3f4}
.dark .x-toc{background:#16181c;border-color:#2f3336}
.x-toc-title{font-weight:800;font-size:1rem;margin-bottom:10px}
.x-toc-list{padding-left:4px;list-style:none}
.toc-item{padding:3px 0}
.toc-item a{color:#536471;font-size:.9rem;text-decoration:none;transition:color .15s}
.dark .toc-item a{color:#71767b}
.toc-item a:hover{color:#1d9bf0}
.toc-sub{padding-left:16px}

/* ── 分页 ── */
.page-nav-inner a{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 12px;border-radius:9999px;font-weight:500;font-size:.9rem;text-decoration:none;transition:all .2s;color:#536471}
.dark .page-nav-inner a{color:#71767b}
.page-nav-inner a:hover{background:#f7f7f7}
.dark .page-nav-inner a:hover{background:#080808}
.page-current{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 12px;border-radius:9999px;background:#1d9bf0!important;color:#fff!important;font-weight:700}
.page-nav-inner .prev,.page-nav-inner .next{font-weight:600;color:#0f1419}
.dark .page-nav-inner .prev,.dark .page-nav-inner .next{color:#e7e9ea}

/* ── 缩略图 ── */
.tweet-image{border-radius:16px;overflow:hidden;border:1px solid #eff3f4;margin-bottom:8px}
.dark .tweet-image{border-color:#2f3336}
.tweet-image img{width:100%;display:block;transition:transform .25s ease}
.tweet-image:hover img{transform:scale(1.03)}

/* ── 文章正文 ── */
.tweet-text-full h2{font-size:1.3rem;margin:20px 0 10px;font-weight:700;color:#0f1419}
.dark .tweet-text-full h2{color:#e7e9ea}
.tweet-text-full h3{font-size:1.15rem;margin:16px 0 8px;font-weight:700}
.tweet-text-full h4{margin:14px 0 6px;font-weight:700}
.tweet-text-full img{border-radius:16px;margin:10px 0;border:1px solid #eff3f4;max-width:100%;height:auto}
.dark .tweet-text-full img{border-color:#2f3336}
.tweet-text-full pre{padding:14px 16px;padding-top:38px;margin:10px 0;border-radius:10px;position:relative;overflow-x:auto;background:#1e1e1e;color:#d4d4d4}
.dark .tweet-text-full pre{background:#0d1117}
/* macOS 三色圆点 */
.tweet-text-full pre::before{content:'';position:absolute;top:12px;left:16px;width:12px;height:12px;border-radius:50%;background:#ff5f57;box-shadow:20px 0 0 #febc2e,40px 0 0 #28c840}
/* macOS 标题栏拖拽区 */
.tweet-text-full pre::after{content:attr(data-lang);position:absolute;top:10px;left:50%;transform:translateX(-50%);font-size:.7rem;color:#999;font-family:-apple-system,BlinkMacSystemFont,sans-serif}
.tweet-text-full pre code{background:transparent!important;padding:0!important}
.tweet-text-full code{font-size:.88em}
.tweet-text-full blockquote{border-left:3px solid #1d9bf0;padding:4px 14px;color:#536471;margin:10px 0;font-style:italic}
.dark .tweet-text-full blockquote{color:#71767b}
.tweet-text-full ul,.tweet-text-full ol{padding-left:24px;margin:8px 0}
.tweet-text-full ul{list-style:disc}
.tweet-text-full ol{list-style:decimal}
.tweet-text-full li{margin-bottom:4px}
.tweet-text-full table{width:100%;border-collapse:collapse;margin:10px 0;font-size:.9rem}
.tweet-text-full td,.tweet-text-full th{border:1px solid #eff3f4;padding:8px 12px;text-align:left}
.dark .tweet-text-full td,.dark .tweet-text-full th{border-color:#2f3336}
.tweet-text-full th{background:#f7f9f9;font-weight:700}
.dark .tweet-text-full th{background:#16181c}
.tweet-text-full video,.tweet-text-full iframe{max-width:100%;border-radius:12px;margin:8px 0}
.tweet-text-full hr{border:none;border-top:1px solid #eff3f4;margin:20px 0}
.dark .tweet-text-full hr{border-color:#2f3336}
.tweet-text-full a{color:#1d9bf0;text-decoration:none}
.tweet-text-full a:hover{text-decoration:underline}
.tweet-text-full p{margin:8px 0;line-height:1.75}

/* ── Emoji 面板 ── */
.emoji-panel{max-width:320px}
.emoji-item:hover{transform:scale(1.2);transition:transform .1s ease}

/* ── 焦点可访问性 ── */
*:focus-visible{outline:2px solid #1d9bf0;outline-offset:2px;border-radius:4px}
button:focus-visible,a:focus-visible{border-radius:9999px}

/* ── 移动端优化 ── */
@media(max-width:688px){
    .x-toast{bottom:90px;font-size:.8rem;padding:8px 18px}
    #mobileNavOverlay{transition:opacity .2s ease}
}
