:root{
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --ink:#202124;--muted:#8a8f98;--line:#e8e9ec;--soft:#f6f7f8;--white:#fff;
  --red:#df2f35;--green:#23834a;--shadow:0 12px 36px rgba(20,24,32,.06);
}
*{box-sizing:border-box}
html{font-family:var(--font);color:var(--ink);background:#f8f8f7;scroll-behavior:smooth}
body{margin:0;min-height:100vh}button,input{font:inherit}a,button,input{-webkit-tap-highlight-color:transparent}
button{appearance:none;border:0;cursor:pointer}.is-hidden{display:none!important}

/* ========================= 前端 · 深色资源列表 ========================= */
.front-html{background:#111;color-scheme:dark}
.site-home{--front-bg:#111111;--front-line:#262626;--front-ink:#f3f3f3;--front-muted:#a4a4a8;margin:0;min-height:100vh;background:var(--front-bg);color:var(--front-ink)}
.site-topbar{height:47px;border-bottom:1px solid var(--front-line);background:#111}
.site-topbar-inner{width:min(calc(100% - 32px),976px);height:100%;margin:0 auto;display:flex;align-items:center}
.site-brand{color:#f2f2f2;text-decoration:none;font-size:21px;font-weight:500;line-height:1;letter-spacing:.01em}
.page{width:min(calc(100% - 32px),976px);margin:24px auto 0;position:relative}

/* ========================= 头部“搭建同款”按钮 ========================= */
.build-same-btn{margin-left:auto;display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 13px;border:1px solid #3a3a3e;border-radius:999px;background:linear-gradient(135deg,#232325,#18181a);color:#e8e8eb;font-size:11.5px;font-weight:650;line-height:1;white-space:nowrap;cursor:pointer;transition:background .16s,border-color .16s,transform .16s}
.build-same-btn:hover{background:linear-gradient(135deg,#2d2d30,#202022);border-color:#4a4a4d}
.build-same-btn:active{transform:scale(.96)}
.build-same-emoji{font-size:13px;line-height:1}

/* ========================= 置顶广告卡片 ========================= */
.ad-card{display:flex;align-items:center;gap:9px;margin-bottom:14px;padding:13px 15px;border:1px solid #3a3a3e;border-radius:13px;background:linear-gradient(135deg,#1a1a1c,#151517);color:#f3f3f3;text-decoration:none;cursor:pointer;transition:background .16s,border-color .16s,transform .16s;position:relative;overflow:hidden}
.ad-card:hover{background:linear-gradient(135deg,#202022,#1a1a1c);border-color:#4a4a4d}
.ad-card:active{transform:scale(.995)}
.ad-card-emoji{flex:0 0 auto;font-size:18px;line-height:1}
.ad-card-title{flex:1;min-width:0;font-size:13px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ad-card-arrow{flex:0 0 auto;color:#7a7a7e;font-size:18px;line-height:1;transform:translateY(-1px)}

/* ========================= 富文本内容弹窗 ========================= */
.rt-modal{position:fixed;inset:0;z-index:130;display:none;align-items:center;justify-content:center;padding:20px}
.rt-modal.is-open{display:flex}
.rt-modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.68);backdrop-filter:blur(6px)}
.rt-modal-card{position:relative;z-index:1;width:min(100%,560px);max-height:82vh;display:flex;flex-direction:column;padding:24px 22px 20px;border:1px solid #2c2c2f;border-radius:16px;background:#18181a;color:#f3f3f3;box-shadow:0 24px 60px rgba(0,0,0,.5);animation:rtIn .18s both}
@keyframes rtIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.rt-close{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:8px;background:#232325;color:#9a9a9e;font-size:19px;line-height:1;display:grid;place-items:center;transition:background .15s,color .15s}
.rt-close:hover{background:#2d2d30;color:#fff}
.rt-title-line{display:flex;align-items:center;justify-content:center;gap:7px;margin-bottom:14px;padding-right:30px;min-width:0}
.rt-emoji{flex:0 0 auto;font-size:15px}
.rt-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:650;color:#f3f3f3}
.rt-content{overflow-y:auto;flex:1;min-height:0;padding:2px 4px 4px;font-size:13.5px;line-height:1.65;color:#e8e8eb;word-wrap:break-word;overflow-wrap:break-word;-webkit-overflow-scrolling:touch}
/* 富文本渲染：标题、段落、列表、图片、链接等 */
.rt-content h1,.rt-content h2,.rt-content h3{color:#fff;margin:16px 0 8px;line-height:1.3}
.rt-content h1{font-size:19px}.rt-content h2{font-size:16px}.rt-content h3{font-size:14px}
.rt-content p{margin:8px 0}
.rt-content a{color:#6ea8e0;text-decoration:underline;word-break:break-all}
.rt-content a:hover{color:#8ec3f0}
.rt-content img{max-width:100%;height:auto;border-radius:8px;margin:8px 0}
.rt-content ul,.rt-content ol{margin:8px 0;padding-left:22px}
.rt-content li{margin:4px 0}
.rt-content blockquote{margin:10px 0;padding:8px 12px;border-left:3px solid #444;background:#1f1f21;color:#c8c8cc;border-radius:0 6px 6px 0}
.rt-content pre{margin:10px 0;padding:10px 12px;border-radius:8px;background:#0e0e10;color:#e8e8eb;overflow-x:auto;font-size:12px;line-height:1.5}
.rt-content code{background:#2a2a2c;color:#e8b8b4;padding:1px 5px;border-radius:4px;font-size:12px}
.rt-content pre code{background:transparent;color:inherit;padding:0}
.rt-content strong,.rt-content b{color:#fff;font-weight:700}
.rt-content em,.rt-content i{color:#d0d0d3}
.rt-content hr{border:0;border-top:1px solid #2a2a2c;margin:14px 0}
.resource-filter-bar{display:flex;align-items:flex-start;gap:13px;margin:0 0 13px;padding:0 4px 14px;border-bottom:1px solid var(--front-line)}
.filter-label{flex:0 0 auto;padding-top:6px;color:#d0d0d3;font-size:12px;font-weight:650;line-height:1.2}
.front-tag-nav{display:flex;align-items:center;gap:7px;flex-wrap:wrap;min-width:0}
.front-tag-chip{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:28px;padding:0 11px;border:1px solid #333336;border-radius:999px;background:#18181a;color:#99999e;font-size:11.5px;line-height:1;white-space:nowrap;transition:background .16s,border-color .16s,color .16s,transform .16s}
.front-tag-chip small{color:#68686d;font-size:9px;transition:color .16s}.front-tag-chip:hover{background:#202022;border-color:#444448;color:#e8e8eb}.front-tag-chip.is-active{background:#f0f0f1;border-color:#f0f0f1;color:#111;font-weight:650}.front-tag-chip.is-active small{color:#646468}.front-tag-chip:active{transform:scale(.97)}
.links{display:block}.link-item{position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:74px;padding:12px 7px 12px 5px;border-bottom:1px solid var(--front-line);color:inherit;text-decoration:none;animation:linkIn .3s both;animation-delay:calc(min(var(--i),12)*18ms);transition:background .16s,padding-left .16s,opacity .18s,transform .18s}
.link-item:hover{background:#141414;padding-left:8px}.link-item:active{background:#171717}.link-item:focus-visible{outline:1px solid #676767;outline-offset:-1px}.link-item.is-filtered-out{display:none}
.resource-main{display:flex;min-width:0;flex:1 1 auto;flex-direction:column;justify-content:center;gap:6px}.resource-title-line{display:flex;align-items:center;min-width:0;gap:7px;color:#f7f7f7;font-size:15px;line-height:1.35;font-weight:560}.resource-emoji{flex:0 0 auto;min-width:18px;text-align:center;font-size:14px;line-height:1;white-space:nowrap}.link-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resource-meta{padding-left:31px;color:#b2b2b6;font-size:11.5px;line-height:1.3}
.quark-pill{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:5px;height:26px;padding:0 11px;border:1px solid #37373a;border-radius:999px;background:#202022;color:#e8e8eb;font-size:11.5px;line-height:1;white-space:nowrap;transition:background .16s,border-color .16s,transform .16s}.link-item:hover .quark-pill{background:#262628;border-color:#4a4a4d}.link-item:active .quark-pill{transform:scale(.98)}.quark-logo{display:block;width:15px;height:15px;object-fit:contain;border-radius:3px;flex:0 0 auto}
/* 今日点击徽标：仅电脑端（支持 hover 的设备）悬浮卡片时显示 */
.click-badge{position:absolute;top:3px;right:9px;z-index:2;display:inline-flex;align-items:center;gap:5px;height:21px;padding:0 10px;border:1px solid #3a3a3e;border-radius:999px;background:rgba(22,22,24,.95);color:#f3f3f3;font-size:11px;font-weight:650;line-height:1;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(-3px);transition:opacity .16s,transform .16s;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.click-badge .click-eye{width:13px;height:13px;flex:0 0 auto}
.click-badge b{color:var(--red);font-size:12.5px;font-weight:800;font-style:normal}
@media(hover:hover){.link-item:hover .click-badge{opacity:1;transform:translateY(0)}}
.site-footer{padding:45px 0 36px;text-align:center;color:#8e8e93;font-size:11px;line-height:1.5}.front-empty{margin:0;padding:48px 4px;border-bottom:1px solid var(--front-line);text-align:center;color:#77777c;font-size:12px}
@keyframes linkIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(min-width:1180px){.page,.site-topbar-inner{width:min(calc(100% - 64px),976px)}.site-brand{font-size:21px}.link-item{min-height:74px}}
@media(max-width:640px){.site-topbar{height:50px}.site-topbar-inner{width:calc(100% - 26px)}.site-brand{font-size:18.5px}.page{width:calc(100% - 24px);margin-top:12px}.resource-filter-bar{align-items:center;gap:9px;margin-bottom:7px;padding:0 2px 10px}.filter-label{padding-top:0;font-size:11px}.front-tag-nav{flex:1;flex-wrap:nowrap;overflow-x:auto;gap:6px;padding-bottom:1px;scrollbar-width:none}.front-tag-nav::-webkit-scrollbar{display:none}.front-tag-chip{min-height:26px;padding:0 9px;font-size:10px}.front-tag-chip small{font-size:8px}.link-item{min-height:68px;padding:10px 2px;gap:12px}.link-item:hover{padding-left:2px;background:transparent}.resource-title-line{font-size:13.5px;gap:6px}.resource-emoji{min-width:20px;font-size:12px}.resource-meta{padding-left:27px;font-size:10.5px}.quark-pill{height:24px;padding:0 8px;font-size:10px}.quark-logo{width:13px;height:13px}.site-footer{padding:36px 0 28px;font-size:10px}}
@media(max-width:390px){.link-item{gap:8px}.quark-pill{padding:0 7px}.quark-pill>span:last-child{display:none}.quark-pill{width:28px}.resource-title-line{font-size:12.5px}}
@media(prefers-reduced-motion:reduce){.link-item{animation:none;transition:none}.front-tag-chip,.quark-pill{transition:none}}

/* ========================= 桌面端扫码弹窗 ========================= */
body.modal-open{overflow:hidden}
.qr-modal{position:fixed;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:20px}
.qr-modal.is-open{display:flex}
.qr-modal-bg{position:absolute;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(5px)}
.qr-modal-card{position:relative;z-index:1;width:min(100%,340px);padding:26px 24px 22px;border:1px solid #2c2c2f;border-radius:16px;background:#18181a;color:#f3f3f3;box-shadow:0 24px 60px rgba(0,0,0,.5);text-align:center;animation:qrIn .18s both}
@keyframes qrIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
.qr-close{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:8px;background:#232325;color:#9a9a9e;font-size:19px;line-height:1;display:grid;place-items:center;transition:background .15s,color .15s}
.qr-close:hover{background:#2d2d30;color:#fff}
.qr-title-line{display:flex;align-items:center;justify-content:center;gap:7px;margin-bottom:16px;min-width:0}
.qr-emoji{flex:0 0 auto;font-size:15px}
.qr-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:600;color:#f3f3f3}
.qr-box{display:inline-flex;align-items:center;justify-content:center;width:226px;height:226px;padding:8px;border-radius:12px;background:#fff;box-shadow:0 6px 22px rgba(0,0,0,.35)}
.qr-box canvas,.qr-box img{display:block;width:210px!important;height:210px!important}
.qr-hint{margin:14px 0 4px;color:#a4a4a8;font-size:11.5px;line-height:1.5}
.qr-open-link{display:inline-flex;align-items:center;min-height:32px;margin-top:8px;padding:0 14px;border:1px solid #37373a;border-radius:999px;background:#202022;color:#e8e8eb;font-size:11.5px;text-decoration:none;transition:background .15s,border-color .15s}
.qr-open-link:hover{background:#262628;border-color:#4a4a4d}
.qr-open-link.is-hidden{display:none}
@media(max-width:640px){.qr-modal{padding:14px}.qr-modal-card{padding:22px 18px 18px;border-radius:14px}.qr-box{width:196px;height:196px}.qr-box canvas,.qr-box img{width:180px!important;height:180px!important}.rt-modal{padding:12px}.rt-modal-card{padding:20px 16px 16px;border-radius:14px;max-height:88vh}.rt-content{font-size:13px;line-height:1.6}.ad-card{padding:11px 13px;margin-bottom:10px}.ad-card-emoji{font-size:16px}.ad-card-title{font-size:12.5px}.build-same-btn{height:28px;padding:0 11px;font-size:11px}.build-same-emoji{font-size:12px}}
@media(max-width:390px){.build-same-btn span:last-child{display:none}.build-same-btn{width:34px;justify-content:center}.ad-card-title{font-size:12px}}
@media(prefers-reduced-motion:reduce){.qr-modal-card,.rt-modal-card{animation:none}.qr-close,.qr-open-link,.rt-close{transition:none}}
