/* =========================================================
   笑一个吧 - 全站样式
   ========================================================= */

/* ---------- 变量 ---------- */
:root{
    --paper:#f7f3ea;
    --paper-2:#ffffff;
    --ink:#1a1a1a;
    --ink-2:#4a4a4a;
    --ink-3:#9a9691;
    --ink-4:#c8c4bd;
    --line:#f4f1ea;
    --line-2:#ece7dd;
    --red:#d64533;
    --font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",sans-serif;
    --serif:"Songti SC","STSong","SimSun","Georgia",serif;
    --fs:17px;
    --lh:1.95;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
    background:var(--paper);
    color:var(--ink);
    font-family:var(--font);
    font-size:var(--fs);
    line-height:var(--lh);
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
    transition:background .35s ease,color .25s ease;
    position:relative;
    overflow-x:hidden;
}
a{color:inherit;text-decoration:none;transition:color .15s;}
a:hover{color:var(--red);}
.wrap{max-width:700px;margin:0 auto;padding:0 24px;position:relative;z-index:1;}

/* ---------- 背景飘浮图标 ---------- */
.bg-emoji{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;}
.bg-emoji span{
    position:absolute;display:inline-flex;align-items:center;justify-content:center;
    color:var(--red);opacity:.05;animation:float 18s ease-in-out infinite;
}
.bg-emoji span i{font-size:1em;}
.bg-emoji span:nth-child(1){top:8%;left:5%;animation-delay:0s;font-size:56px;animation-name:float;}
.bg-emoji span:nth-child(2){top:22%;right:8%;animation-delay:-3s;font-size:72px;animation-name:float-2;animation-duration:22s;}
.bg-emoji span:nth-child(3){top:48%;left:3%;animation-delay:-6s;font-size:44px;animation-name:float;}
.bg-emoji span:nth-child(4){top:68%;right:6%;animation-delay:-9s;font-size:64px;animation-name:float-2;animation-duration:24s;}
.bg-emoji span:nth-child(5){top:85%;left:12%;animation-delay:-12s;font-size:52px;animation-name:float;}
.bg-emoji span:nth-child(6){top:38%;right:18%;animation-delay:-5s;font-size:40px;animation-name:float-2;animation-duration:20s;}
@keyframes float{0%,100%{transform:translateY(0) rotate(-3deg);}50%{transform:translateY(-34px) rotate(6deg);}}
@keyframes float-2{0%,100%{transform:translate(0,0) rotate(2deg);}50%{transform:translate(-14px,-26px) rotate(-8deg);}}
body.dark .bg-emoji span{opacity:.04;color:#e8e6e2;}

/* ---------- 顶栏 ---------- */
.topbar{padding:26px 0 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.brand{display:flex;align-items:center;gap:11px;line-height:1;transition:transform .25s ease;}
.brand:hover{transform:translateX(1px);}
.brand .logo-mark{
    width:36px;height:36px;border-radius:11px;
    background:linear-gradient(145deg,#e85c46 0%,#c93a2b 100%);
    color:#fff;display:inline-flex;align-items:center;justify-content:center;
    font-size:17px;flex-shrink:0;
    box-shadow:0 6px 16px rgba(214,69,51,.32),0 2px 4px rgba(214,69,51,.18),inset 0 1px 0 rgba(255,255,255,.25);
    transition:transform .4s cubic-bezier(.34,1.56,.64,1);position:relative;
}
.brand .logo-mark::after{content:"";position:absolute;inset:0;border-radius:11px;background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 50%);pointer-events:none;}
.brand:hover .logo-mark{transform:rotate(-8deg) scale(1.08);}
.brand .name-wrap{display:flex;flex-direction:column;gap:3px;padding-top:1px;}
.brand .name{font-family:var(--serif);font-size:19px;font-weight:700;letter-spacing:1px;color:var(--ink);line-height:1.1;}
.brand small{font-family:var(--font);font-size:8.5px;color:var(--ink-3);font-weight:600;letter-spacing:3px;text-transform:uppercase;line-height:1;}
.set-btn{
    background:var(--paper-2);border:1px solid var(--line-2);border-radius:10px;
    padding:7px 14px;cursor:pointer;font-size:12px;color:var(--ink-2);
    letter-spacing:.5px;font-weight:600;font-family:var(--font);
    display:inline-flex;align-items:center;gap:6px;transition:all .2s;flex-shrink:0;
}
.set-btn i{font-size:11px;transition:transform .4s;}
.set-btn:hover{color:var(--red);border-color:rgba(214,69,51,.35);background:rgba(214,69,51,.04);box-shadow:0 4px 14px rgba(214,69,51,.1);}
.set-btn:hover i{transform:rotate(180deg);}

/* ---------- 面包屑 ---------- */
.crumb{
    font-size:12px;color:var(--ink-3);padding:0 0 14px;letter-spacing:.2px;
    display:flex;align-items:center;flex-wrap:wrap;gap:6px;line-height:1.6;
}
.crumb a{
    color:var(--ink-3);display:inline-flex;align-items:center;gap:5px;
    padding:3px 9px;border-radius:8px;border:1px solid transparent;
    transition:all .18s;font-weight:500;
}
.crumb a:hover{color:var(--red);background:rgba(214,69,51,.04);border-color:rgba(214,69,51,.1);}
.crumb a i{font-size:10px;color:rgba(214,69,51,.7);}
.crumb .sep{color:var(--ink-4);font-size:10px;user-select:none;opacity:.5;}
.crumb .current{
    color:var(--ink-2);font-weight:500;padding:3px 0;
    display:inline-flex;align-items:center;gap:5px;
    max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.crumb .current i{font-size:10px;color:var(--ink-4);}

/* ---------- Hero ---------- */
.hero{padding:6px 0 22px;border-bottom:1px solid var(--line);position:relative;}
.hero .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    font-size:10px;font-weight:700;color:rgba(214,69,51,.75);
    letter-spacing:2.5px;text-transform:uppercase;margin-bottom:10px;
}
.hero .eyebrow::before{content:"";width:18px;height:1px;background:rgba(214,69,51,.5);}
.hero h1{
    font-family:var(--serif);font-size:30px;line-height:1.3;font-weight:700;
    letter-spacing:.5px;margin:0 0 10px;color:var(--ink);
    display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
}
.hero h1 .em{
    font-size:.7em;color:rgba(214,69,51,.85);font-weight:400;
    animation:spin 6s ease-in-out infinite;display:inline-block;transform-origin:center;
}
@keyframes spin{0%,100%{transform:rotate(0);}50%{transform:rotate(15deg);}}
.hero .slogan{font-size:13px;color:var(--ink-3);letter-spacing:.3px;line-height:1.9;margin-bottom:10px;}
.hero .sub{font-size:12.5px;color:var(--ink-3);letter-spacing:.3px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.hero .sub .dot{width:3px;height:3px;border-radius:50%;background:var(--ink-4);display:inline-block;}
.hero .sub b{font-weight:700;color:rgba(214,69,51,.85);font-variant-numeric:tabular-nums;}

/* ---------- 分类条 ---------- */
.cat-bar{padding:16px 0 18px;border-bottom:1px solid var(--line);}
.cat-bar .hd{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:12px;cursor:pointer;user-select:none;transition:color .18s;
}
.cat-bar .hd .lbl{
    font-size:10.5px;color:var(--ink-3);letter-spacing:2.5px;text-transform:uppercase;
    font-weight:700;display:inline-flex;align-items:center;gap:8px;
}
.cat-bar .hd .lbl::before{content:"";width:18px;height:1px;background:rgba(214,69,51,.5);}
.cat-bar .hd .toggle{
    font-size:10.5px;color:var(--ink-3);display:inline-flex;align-items:center;gap:5px;
    letter-spacing:.3px;transition:color .18s;
}
.cat-bar .hd .toggle i{font-size:10px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);}
.cat-bar .hd:hover .lbl,.cat-bar .hd:hover .toggle{color:var(--red);}
.cat-bar.open .hd .toggle i{transform:rotate(180deg);}
.cat-bar .bd{
    max-height:0;overflow:hidden;
    transition:max-height .4s cubic-bezier(.34,1.2,.64,1),padding .3s;padding:0;
}
.cat-bar.open .bd{max-height:1200px;padding:4px 0 4px;}
.cat-bar .grid{display:flex;flex-wrap:wrap;gap:6px;}
.cat-bar .grid a{
    font-size:12.5px;color:var(--ink-3);border:1px solid var(--line);
    padding:4px 11px;border-radius:12px;letter-spacing:.2px;font-weight:400;
    transition:all .18s;display:inline-flex;align-items:center;gap:5px;
    line-height:1.4;white-space:nowrap;
}
.cat-bar .grid a .c{font-size:10.5px;color:var(--ink-4);font-variant-numeric:tabular-nums;transition:color .18s;}
.cat-bar .grid a:hover{color:var(--red);border-color:rgba(214,69,51,.2);background:rgba(214,69,51,.04);}
.cat-bar .grid a:hover .c{color:rgba(214,69,51,.7);}

/* ---------- 分类/标签头部 ---------- */
.cat-head,.tag-head{padding:2px 0 20px;border-bottom:1px solid var(--line);position:relative;}
.cat-head .eyebrow,.tag-head .eyebrow{
    display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:700;
    color:rgba(214,69,51,.75);letter-spacing:2.5px;text-transform:uppercase;margin-bottom:8px;
}
.cat-head .eyebrow::before,.tag-head .eyebrow::before{content:"";width:18px;height:1px;background:rgba(214,69,51,.5);}
.cat-head h1,.tag-head h1{
    font-family:var(--serif);font-size:28px;line-height:1.35;font-weight:700;
    letter-spacing:.5px;margin:0 0 10px;color:var(--ink);word-break:break-word;
}
.tag-head h1 .hash{color:rgba(214,69,51,.5);font-weight:400;margin-right:2px;}
.cat-head .sub,.tag-head .sub{
    font-size:12.5px;color:var(--ink-3);letter-spacing:.3px;
    display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.cat-head .sub .dot,.tag-head .sub .dot{width:3px;height:3px;border-radius:50%;background:var(--ink-4);display:inline-block;}
.cat-head .sub b,.tag-head .sub b{font-weight:700;color:rgba(214,69,51,.85);font-variant-numeric:tabular-nums;}

/* ---------- 全部分类（折叠） ---------- */
.all-cats{border-bottom:1px solid var(--line);padding:0;}
.all-cats .hd{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 0;cursor:pointer;user-select:none;transition:color .18s;
}
.all-cats .hd .lbl{
    font-size:11px;color:var(--ink-3);letter-spacing:2.5px;text-transform:uppercase;
    font-weight:700;display:inline-flex;align-items:center;gap:10px;
}
.all-cats .hd .lbl::before{content:"";width:18px;height:1px;background:rgba(214,69,51,.5);}
.all-cats .hd .toggle{
    font-size:11px;color:var(--ink-3);display:inline-flex;align-items:center;gap:6px;
    letter-spacing:.3px;transition:color .18s;
}
.all-cats .hd .toggle i{font-size:10px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);}
.all-cats .hd:hover{color:var(--red);}
.all-cats .hd:hover .lbl,.all-cats .hd:hover .toggle{color:var(--red);}
.all-cats.open .hd .toggle i{transform:rotate(180deg);}
.all-cats .bd{
    max-height:0;overflow:hidden;
    transition:max-height .4s cubic-bezier(.34,1.2,.64,1),padding .3s;padding:0;
}
.all-cats.open .bd{max-height:800px;padding:4px 0 20px;}
.all-cats .grid{display:flex;flex-wrap:wrap;gap:6px;}
.all-cats .grid a{
    font-size:12.5px;color:var(--ink-3);border:1px solid var(--line);
    padding:4px 11px;border-radius:12px;letter-spacing:.2px;font-weight:400;
    transition:all .18s;display:inline-flex;align-items:center;gap:5px;
    line-height:1.4;white-space:nowrap;
}
.all-cats .grid a .c{font-size:10.5px;color:var(--ink-4);font-variant-numeric:tabular-nums;transition:color .18s;}
.all-cats .grid a:hover{color:var(--red);border-color:rgba(214,69,51,.2);background:rgba(214,69,51,.04);}
.all-cats .grid a:hover .c{color:rgba(214,69,51,.7);}
.all-cats .grid a.active{color:var(--red);border-color:rgba(214,69,51,.35);background:rgba(214,69,51,.05);font-weight:600;}
.all-cats .grid a.active .c{color:rgba(214,69,51,.7);}

/* ---------- 列表 ---------- */
.list{padding:6px 0 8px;}
.list ul{list-style:none;margin:0;padding:0;}
.list li{border-bottom:1px solid var(--line);}
.list li:last-child{border-bottom:none;}
.list li a{display:flex;align-items:baseline;gap:16px;padding:15px 0;transition:all .18s;}
.list li a .num{
    font-family:var(--font);font-size:11px;color:var(--ink-4);font-weight:700;
    letter-spacing:.5px;min-width:26px;text-align:left;
    font-variant-numeric:tabular-nums;transition:color .18s;flex-shrink:0;
}
.list li a .t{
    flex:1;color:var(--ink);font-size:15.5px;font-weight:500;letter-spacing:.2px;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:color .18s;
}
.list li a .cat{
    font-size:11px;color:var(--ink-4);background:rgba(214,69,51,.05);
    border:1px solid var(--line);padding:2px 8px;border-radius:8px;
    letter-spacing:.2px;flex-shrink:0;transition:all .18s;display:none;
}
.list li a .meta{
    font-size:11.5px;color:var(--ink-4);letter-spacing:.3px;
    font-variant-numeric:tabular-nums;flex-shrink:0;transition:color .18s;
    display:inline-flex;align-items:center;gap:4px;
}
.list li a .meta i{font-size:10px;}
.list li a:hover .num,.list li a:hover .t{color:var(--red);}
.list li a:hover .meta{color:var(--ink-3);}
.list li a:hover .cat{color:rgba(214,69,51,.85);border-color:rgba(214,69,51,.2);}
@media(min-width:520px){.list li a .cat{display:inline-flex;align-items:center;}}

.empty-tip{text-align:center;color:var(--ink-3);font-size:13px;letter-spacing:1px;padding:50px 0;}

/* ---------- 分页 ---------- */
.pager{
    display:flex;justify-content:center;align-items:center;
    gap:4px;padding:28px 0 10px;flex-wrap:wrap;user-select:none;
}
.pager a,.pager span{
    min-width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;
    padding:0 10px;font-size:13px;font-weight:600;color:var(--ink-2);
    border:1px solid var(--line-2);border-radius:9px;background:var(--paper-2);
    transition:all .18s;letter-spacing:.3px;
}
.pager a:hover{color:var(--red);border-color:rgba(214,69,51,.35);background:rgba(214,69,51,.04);transform:translateY(-1px);}
.pager .cur{background:var(--red);color:#fff;border-color:var(--red);box-shadow:0 4px 12px rgba(214,69,51,.28);}
.pager .dots{border:none;background:transparent;color:var(--ink-4);min-width:22px;padding:0;}
.pager .disabled{color:var(--ink-4);cursor:not-allowed;opacity:.55;}
.pager .disabled:hover{transform:none;border-color:var(--line-2);background:var(--paper-2);color:var(--ink-4);}
.pager .nav-btn i{font-size:11px;}
.pager-info{
    text-align:center;font-size:11.5px;color:var(--ink-3);letter-spacing:1px;
    padding:6px 0 0;font-variant-numeric:tabular-nums;
}
.pager-info b{color:rgba(214,69,51,.85);font-weight:700;}

/* ---------- 内容页 ---------- */
.headline{padding:4px 0 24px;}
.cat-label{
    display:inline-flex;align-items:center;gap:6px;font-family:var(--font);
    font-size:10.5px;font-weight:700;color:var(--red);background:rgba(214,69,51,.05);
    padding:3px 10px;border-radius:10px;letter-spacing:1.5px;text-transform:uppercase;
    margin-bottom:14px;
}
.cat-label::before{content:"";width:5px;height:5px;border-radius:50%;background:rgba(214,69,51,.7);animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.4);opacity:.6;}}
.headline h1{
    font-family:var(--serif);font-size:30px;line-height:1.4;font-weight:700;
    letter-spacing:.2px;margin:0 0 18px;color:var(--ink);word-break:break-word;
}
.headline .meta{
    font-size:12px;color:var(--ink-3);display:flex;gap:16px;flex-wrap:wrap;
    letter-spacing:.3px;font-family:var(--font);
}
.headline .meta a,.headline .meta span{display:inline-flex;align-items:center;gap:5px;transition:color .15s;}
.headline .meta a{color:var(--ink-3);}
.headline .meta a:hover{color:var(--red);}
.headline .meta i{color:rgba(214,69,51,.7);font-size:11px;}
.headline .meta .time-label{color:rgba(214,69,51,.85);font-weight:600;}

.article{
    padding:24px 0 12px;font-size:var(--fs);line-height:var(--lh);color:#262626;
    word-break:break-word;letter-spacing:.3px;transition:font-family .3s ease;
}
.article p{margin:0 0 22px;}
.article p:first-child::first-letter{
    font-family:var(--serif);font-size:2.4em;line-height:.95;float:left;
    padding:6px 10px 0 0;color:var(--red);font-weight:700;
}
.article img{max-width:100%;height:auto;margin:16px 0;border-radius:8px;}

/* ---------- 顶踩区 ---------- */
.vote{padding:20px 0 16px;margin-top:6px;border-top:1px solid var(--line);text-align:center;}
.vote-hint{
    font-size:10.5px;color:var(--ink-3);letter-spacing:2.5px;
    margin-bottom:12px;display:inline-flex;align-items:center;gap:10px;
}
.vote-hint::before,.vote-hint::after{content:"";width:18px;height:1px;background:var(--line-2);display:inline-block;}
.vote-cols{display:flex;justify-content:center;align-items:flex-end;gap:50px;padding:0 20px;height:120px;}
.vote-col{
    display:flex;flex-direction:column;align-items:center;gap:5px;
    cursor:pointer;user-select:none;transition:transform .2s;height:100%;justify-content:flex-end;
}
.vote-col:hover{transform:translateY(-2px);}
.vote-num{
    font-family:var(--font);font-size:19px;font-weight:900;color:var(--ink);
    line-height:1;letter-spacing:-.5px;font-variant-numeric:tabular-nums;
    transition:color .2s;min-height:19px;
}
.vote-num.zero{color:var(--ink-4);}
.vote-col.digg.active .vote-num{color:#c93a2b;}
.vote-col.bury.active .vote-num{color:#4b5563;}
.vote-tube-wrap{flex:1;display:flex;align-items:flex-end;width:26px;min-height:0;}
.vote-tube{
    width:26px;height:100%;border-radius:13px;background:rgba(214,69,51,.05);
    position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(214,69,51,.06);
}
.vote-col.bury .vote-tube{background:rgba(107,114,128,.05);box-shadow:inset 0 0 0 1px rgba(107,114,128,.06);}
.vote-fill{
    position:absolute;left:0;right:0;bottom:0;height:0%;
    border-radius:0 0 13px 13px;background:linear-gradient(180deg,#f0735c,#c93a2b);
    transition:height 1.2s cubic-bezier(.22,1,.36,1);
}
.vote-col.bury .vote-fill{background:linear-gradient(180deg,#9aa3b0,#4b5563);}
.vote-fill::after{
    content:"";position:absolute;left:50%;top:0;width:16px;height:4px;border-radius:50%;
    background:rgba(255,255,255,.5);transform:translate(-50%,-50%);filter:blur(1px);
}
.vote-label{
    font-size:11.5px;color:var(--ink-2);font-weight:600;letter-spacing:.5px;
    display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
}
.vote-label i{font-size:12px;color:rgba(214,69,51,.75);}
.vote-col.bury .vote-label i{color:rgba(107,114,128,.75);}
.vote-pct{
    font-size:10px;color:var(--ink-3);letter-spacing:.3px;
    font-variant-numeric:tabular-nums;min-height:12px;
    transition:color .2s,opacity .3s;
}
.vote-pct.hide{opacity:0;}
.vote-col.digg.active .vote-pct{color:#c93a2b;}
.vote-col.bury.active .vote-pct{color:#4b5563;}
.vote-col.disabled{opacity:.45;cursor:not-allowed;}
.vote-col.disabled:hover{transform:none;}
.vote-col.bump .vote-num{animation:bump .7s cubic-bezier(.34,1.56,.64,1);}
@keyframes bump{
    0%{transform:scale(1) translateY(0);}
    30%{transform:scale(1.5) translateY(-6px);color:#c93a2b;}
    60%{transform:scale(1.15) translateY(0);}
    100%{transform:scale(1) translateY(0);}
}
.fly-num{
    position:absolute;left:50%;top:-6px;transform:translateX(-50%);
    font-size:13px;font-weight:900;color:#e85c46;pointer-events:none;
    animation:flyUp 1s cubic-bezier(.34,1.56,.64,1) forwards;z-index:5;
}
@keyframes flyUp{
    0%{opacity:0;transform:translate(-50%,0) scale(.5);}
    20%{opacity:1;transform:translate(-50%,-12px) scale(1.2);}
    100%{opacity:0;transform:translate(-50%,-44px) scale(.9);}
}

/* ---------- 投票弹窗 ---------- */
.vote-pop{background:transparent !important;box-shadow:none !important;border:none !important;}
.vote-pop .layui-layer-content{padding:0 !important;background:transparent !important;overflow:visible !important;}
.vote-pop-inner{
    position:relative;background:var(--paper-2);border-radius:20px;
    padding:26px 24px 22px;text-align:center;
    box-shadow:0 24px 60px rgba(0,0,0,.18),0 0 0 1px var(--line-2);
    animation:votePop .4s cubic-bezier(.34,1.56,.64,1);overflow:hidden;
}
@keyframes votePop{
    0%{opacity:0;transform:scale(.7) translateY(30px);}
    60%{transform:scale(1.05) translateY(-4px);}
    100%{opacity:1;transform:scale(1) translateY(0);}
}
.vote-pop-icon{
    width:52px;height:52px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
    font-size:22px;color:#fff;margin-bottom:12px;
    animation:iconIn .6s cubic-bezier(.34,1.56,.64,1) .1s both;
}
@keyframes iconIn{
    0%{transform:scale(0) rotate(-180deg);}
    60%{transform:scale(1.15) rotate(10deg);}
    100%{transform:scale(1) rotate(0);}
}
.vote-pop-inner.digg .vote-pop-icon{background:linear-gradient(135deg,#f0735c,#c93a2b);box-shadow:0 10px 24px rgba(214,69,51,.4);}
.vote-pop-inner.bury .vote-pop-icon{background:linear-gradient(135deg,#8b94a3,#4b5563);box-shadow:0 10px 24px rgba(107,114,128,.4);}
.vote-pop-title{font-family:var(--serif);font-size:18px;font-weight:700;color:var(--ink);margin-bottom:5px;letter-spacing:.5px;}
.vote-pop-desc{font-size:12px;color:var(--ink-3);letter-spacing:.5px;}

/* ---------- 标签 ---------- */
.tags{
    padding:18px 0 6px;border-top:1px solid var(--line);margin-top:0;
    display:flex;flex-wrap:wrap;gap:6px;font-size:12.5px;
}
.tags a{
    color:var(--ink-3);background:transparent;border:1px solid var(--line);
    padding:3px 10px;border-radius:12px;display:inline-flex;align-items:center;gap:3px;
    letter-spacing:.2px;font-weight:400;transition:all .18s;line-height:1.4;
}
.tags a::before{content:"#";color:rgba(214,69,51,.4);font-weight:600;font-size:12px;}
.tags a i{display:none;}
.tags a:hover{background:rgba(214,69,51,.04);color:var(--red);border-color:rgba(214,69,51,.15);}
.tags a:hover::before{color:rgba(214,69,51,.7);}

/* ---------- 上一篇下一篇 ---------- */
.pager-nav{
    display:grid;grid-template-columns:1fr 1fr;gap:0;margin:24px 0;
    border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.pager-nav a{
    padding:16px 0;display:flex;flex-direction:column;gap:6px;
    font-size:13.5px;color:var(--ink-2);overflow:hidden;
    background:transparent;border:none;border-radius:0;transition:all .18s;
}
.pager-nav a:first-child{padding-right:20px;border-right:1px solid var(--line);}
.pager-nav a:last-child{padding-left:20px;text-align:right;align-items:flex-end;}
.pager-nav .label{
    font-family:var(--font);font-size:9.5px;color:var(--ink-3);
    letter-spacing:2.5px;text-transform:uppercase;font-weight:700;
    display:flex;align-items:center;gap:5px;
}
.pager-nav .label i{color:rgba(214,69,51,.7);font-size:10px;}
.pager-nav .t{
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
    color:var(--ink);font-size:14px;font-weight:500;transition:color .2s;
}
.pager-nav a:hover .t{color:var(--red);}
.pager-nav a:first-child:hover{padding-left:6px;}
.pager-nav a:last-child:hover{padding-right:6px;padding-left:20px;}
.pager-nav .empty .t{color:var(--ink-4);font-weight:400;font-style:italic;}

/* ---------- 相关文章 ---------- */
.related{padding:12px 0 8px;}
.related h2{
    font-family:var(--font);font-size:11.5px;letter-spacing:2.5px;
    font-weight:700;color:var(--ink-3);text-transform:uppercase;margin:0 0 4px;
    display:flex;align-items:center;gap:12px;padding:0 0 14px;
}
.related h2::before{content:"";width:24px;height:1px;background:rgba(214,69,51,.5);}
.related ul{list-style:none;margin:0;padding:0;}
.related li{border-bottom:1px solid var(--line);}
.related li:last-child{border-bottom:none;}
.related li a{display:flex;align-items:center;gap:12px;padding:11px 0;font-size:14.5px;color:var(--ink-2);transition:all .18s;font-family:var(--font);}
.related li a .num{font-family:var(--font);font-size:10.5px;color:var(--ink-4);font-weight:700;letter-spacing:.5px;min-width:22px;font-variant-numeric:tabular-nums;transition:color .18s;}
.related li a .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;color:var(--ink);font-weight:500;transition:color .18s;}
.related li a:hover .t{color:var(--red);}
.related li a:hover .num{color:var(--red);}

/* ---------- 页脚 ---------- */
.footer{
    padding:30px 0 36px;border-top:1px solid var(--line-2);margin-top:24px;
    font-size:11.5px;color:var(--ink-3);letter-spacing:.5px;
    font-family:var(--font);
    display:flex;justify-content:center;align-items:center;
    flex-wrap:wrap;gap:0;
    text-align:center;
}
.footer > *{
    display:inline-flex;align-items:center;
}
.footer > *:not(:last-child)::after{
    content:"·";
    color:var(--ink-4);
    margin:0 14px;
    font-weight:700;
    opacity:.6;
}
.footer-links{
    display:inline-flex;align-items:center;gap:18px;
    flex-wrap:wrap;
}
.footer-links a{
    color:var(--ink-3);
    display:inline-flex;align-items:center;gap:4px;
    transition:color .18s;
}
.footer-links a i{font-size:9px;color:rgba(214,69,51,.7);transition:transform .2s;}
.footer-links a:hover{color:var(--red);}
.footer-links a:hover i{transform:translateX(2px);}

/* ---------- 设置弹窗 ---------- */
#setPanel{display:none;position:fixed;inset:0;background:rgba(20,18,15,.5);z-index:999;backdrop-filter:blur(2px);}
#setPanel .panel{
    position:absolute;right:24px;top:72px;width:290px;background:var(--paper-2);
    border:1px solid var(--line-2);border-radius:14px;padding:22px;
    box-shadow:0 24px 60px rgba(0,0,0,.15);
    animation:pop .22s cubic-bezier(.34,1.4,.64,1);
}
@keyframes pop{from{opacity:0;transform:translateY(-8px) scale(.96);}to{opacity:1;transform:none;}}
#setPanel h3{
    margin:0 0 18px;font-family:var(--font);font-size:10.5px;color:var(--ink-3);
    letter-spacing:2.5px;text-transform:uppercase;font-weight:700;
    display:flex;align-items:center;gap:9px;
}
#setPanel h3::before{content:"";width:16px;height:1px;background:var(--red);}
#setPanel .row{margin-bottom:16px;}
#setPanel .lbl{
    font-family:var(--font);font-size:10px;color:var(--ink-3);
    font-weight:700;letter-spacing:1.8px;text-transform:uppercase;
    margin-bottom:8px;display:block;
}
#setPanel .opts{display:flex;flex-wrap:wrap;gap:5px;}
#setPanel .opt{
    border:1px solid var(--line-2);background:var(--paper);padding:5px 11px;
    font-size:12px;color:var(--ink-2);cursor:pointer;font-family:var(--font);
    letter-spacing:.2px;border-radius:8px;font-weight:500;transition:all .18s;
}
#setPanel .opt:hover{border-color:var(--red);color:var(--red);}
#setPanel .opt.on{background:var(--red);color:#fff;border-color:var(--red);}
#setPanel .close{
    position:absolute;right:12px;top:12px;cursor:pointer;color:var(--ink-3);
    font-size:13px;width:24px;height:24px;border-radius:7px;
    display:flex;align-items:center;justify-content:center;transition:all .15s;
}
#setPanel .close:hover{background:var(--paper);color:var(--red);}
/* ---------- 预加载夜间模式（避免闪烁） ---------- */
html.pre-dark{
    --paper:#1a1917;--paper-2:#232220;--ink:#e8e6e2;--ink-2:#a8a49c;
    --ink-3:#77746e;--ink-4:#3a3a38;--line:#24221e;--line-2:#2c2a26;
}
html.pre-dark body{
    background:#1a1917;
    color:#e8e6e2;
}
/* ---------- 夜间 ---------- */
body.dark{
    --paper:#1a1917;--paper-2:#232220;--ink:#e8e6e2;--ink-2:#a8a49c;--ink-3:#77746e;--ink-4:#3a3a38;
    --line:#24221e;--line-2:#2c2a26;
}
body.dark .article{color:#c8c6c2;}
body.dark .article p:first-child::first-letter{color:var(--red);}
body.dark .vote-tube{background:rgba(214,69,51,.08);box-shadow:inset 0 0 0 1px rgba(214,69,51,.1);}
body.dark .vote-col.bury .vote-tube{background:rgba(107,114,128,.08);box-shadow:inset 0 0 0 1px rgba(107,114,128,.1);}
body.dark .list li a .t{color:var(--ink);}
body.dark .pager a,body.dark .pager span{background:var(--paper-2);}
body.dark .set-btn{background:var(--paper-2);}

/* ---------- 响应式 ---------- */
@media(max-width:640px){
    .hero h1{font-size:24px;}
    .cat-head h1,.tag-head h1{font-size:24px;}
    .headline h1{font-size:24px;}
    .brand .name{font-size:17px;letter-spacing:.5px;}
    .brand .logo-mark{width:32px;height:32px;font-size:15px;border-radius:10px;}
    .brand small{font-size:8px;letter-spacing:2.5px;}
    .set-btn{padding:6px 11px;font-size:11.5px;}
    .wrap{padding:0 18px;}
    .list li a{padding:13px 0;gap:12px;}
    .list li a .t{font-size:14.5px;}
    .list li a .meta{font-size:11px;}
    .pager a,.pager span{min-width:30px;height:30px;font-size:12px;padding:0 8px;}
    .pager-info{font-size:11px;}
    .cat-bar .grid a,.all-cats .grid a{font-size:12px;padding:3px 9px;}
    .article p:first-child::first-letter{font-size:2em;padding:4px 8px 0 0;}
    .pager-nav a{padding:14px 0;}
    .pager-nav .t{font-size:13.5px;}
    .crumb .current{max-width:120px;}
    .vote{padding:16px 0 12px;}
    .vote-cols{gap:36px;height:100px;}
    .vote-tube-wrap{width:22px;}
    .vote-tube{width:22px;border-radius:11px;}
    .vote-fill{border-radius:0 0 11px 11px;}
    .vote-num{font-size:17px;}
    .vote-label{font-size:11px;}
}