:root{
  --bg:#f7f6f3; --bg-soft:#efeee9; --card:#ffffff; --ink:#15171c; --ink-2:#3d4250;
  --muted:#71767f; --line:#e4e1d9; --line-soft:#eeebe4; --accent:#0f766e;
  --shadow:0 1px 2px rgba(20,25,35,.04), 0 8px 24px -12px rgba(20,25,35,.12);
  --radius:14px;
}
html[data-theme="dark"]{
  --bg:#0e1013; --bg-soft:#15181d; --card:#181c22; --ink:#eef0f4; --ink-2:#c3c8d2;
  --muted:#8a919d; --line:#282d36; --line-soft:#212630; --accent:#5eead4;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 12px 32px -16px rgba(0,0,0,.6);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:var(--ink); font-size:14px; line-height:1.65;
  font-family:"Inter","Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased; transition:background .25s ease,color .25s ease;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
a{color:inherit}

/* header */
header{border-bottom:1px solid var(--line);background:var(--bg);position:sticky;top:0;z-index:50}
.topbar{display:flex;align-items:center;justify-content:space-between;height:58px}
.brand{display:flex;align-items:center;gap:10px;font-weight:650;letter-spacing:-.01em}
.brand small{font-weight:450;color:var(--muted);font-size:12px}
.dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 18%,transparent)}
.admin-link{font-size:12.5px;color:var(--accent);text-decoration:none;font-weight:600;border:1px solid var(--line);padding:6px 12px;border-radius:8px;transition:.18s}
.admin-link:hover{border-color:var(--accent)}

/* 主题切换按钮（与 free-ai-token-guide.html 同款；配色全部走主题变量，深浅自动适配） */
.theme-btn{
  border:1px solid var(--line);background:var(--card);color:var(--ink-2);
  height:32px;padding:0 12px;border-radius:8px;cursor:pointer;
  font-size:12.5px;font-family:inherit;display:flex;align-items:center;gap:6px;
  transition:.18s;flex:none;
}
.theme-btn:hover{border-color:var(--muted);color:var(--ink)}

/* hero */
.hero{padding:56px 0 30px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-weight:600;margin-bottom:16px}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--accent)}
h1{font-size:clamp(30px,4.4vw,46px);line-height:1.18;letter-spacing:-.028em;font-weight:700;max-width:760px}
h1 em{font-style:normal;color:var(--accent)}
.lede{margin-top:16px;max-width:680px;color:var(--ink-2);font-size:15px;line-height:1.75}
.lede b{font-weight:600;color:var(--ink)}
.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;margin-top:36px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--line)}
.stat{background:var(--card);padding:18px 20px}
.stat .num{font-size:26px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stat .lbl{font-size:12px;color:var(--muted);margin-top:2px}

/* controls */
.controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:20px 0 4px}
.searchbar{display:flex;gap:8px;align-items:center;flex:1;min-width:220px;max-width:420px}
.searchbar .search{flex:1;min-width:0;max-width:none}
.search{position:relative;flex:1;min-width:220px;max-width:340px}
.search input{width:100%;height:38px;border-radius:9px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:0 12px 0 34px;font-family:inherit;font-size:13.5px;outline:none;transition:.18s}
.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
.search svg{position:absolute;left:11px;top:11px;width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.8}
.chips{display:flex;gap:7px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:var(--card);color:var(--ink-2);height:34px;padding:0 13px;border-radius:8px;cursor:pointer;font-size:12.5px;font-family:inherit;transition:.16s;white-space:nowrap}
.chip:hover{border-color:var(--muted)}
.chip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.legend{margin-top:12px;font-size:12.5px;color:var(--muted);display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* group */
.group{margin-top:32px}
.group-head{display:flex;align-items:baseline;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:18px}
.group-head h2{font-size:16.5px;font-weight:650;letter-spacing:-.01em}
.group-head .desc{font-size:12.5px;color:var(--muted)}
.group-head .count{margin-left:auto;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.more-link{font-size:12px;color:var(--accent);text-decoration:none;white-space:nowrap}
.more-link:hover{text-decoration:underline}
/* 分类页分页 */
.pager{display:flex;gap:6px;justify-content:center;align-items:center;margin-top:30px;flex-wrap:wrap}
.pager .pg{min-width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--card);border-radius:8px;font-size:13px;color:var(--ink-2);text-decoration:none;padding:0 12px;font-variant-numeric:tabular-nums;transition:.16s}
.pager .pg:hover{border-color:var(--accent);color:var(--accent)}
.pager .pg.on{background:var(--ink);color:var(--bg);border-color:var(--ink);cursor:default}
.pager .pg.off{opacity:.45;cursor:default}
.pager .pg.off:hover{border-color:var(--line);color:var(--ink-2)}

/* card */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(292px,1fr));gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 17px 14px;display:flex;flex-direction:column;transition:.2s;box-shadow:var(--shadow);position:relative;cursor:pointer}
.card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.card.is-expired{opacity:.62;filter:grayscale(.25)}
.card-top{display:flex;align-items:flex-start;gap:8px;justify-content:space-between}
.card h3{font-size:14.5px;font-weight:650;letter-spacing:-.01em;line-height:1.4}
/* 标题可能是一整句 SEO 标题，限两行，避免卡片高度不齐 */
.card h3 .t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card h3 .sub{display:block;font-size:11.5px;font-weight:400;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge{font-size:10.5px;font-weight:600;letter-spacing:.03em;padding:2.5px 7px;border-radius:5px;white-space:nowrap;line-height:1.4}
.b-perm{background:color-mix(in srgb,#0f766e 13%,transparent);color:#0d7a6f}
.b-daily{background:color-mix(in srgb,#2563eb 12%,transparent);color:#2563eb}
.b-trial{background:color-mix(in srgb,#d97706 15%,transparent);color:#b45309}
.b-web{background:color-mix(in srgb,#7c3aed 12%,transparent);color:#7c3aed}
.b-local{background:color-mix(in srgb,#475569 13%,transparent);color:#475569}
.s-active{background:color-mix(in srgb,#16a34a 14%,transparent);color:#15803d}
.s-pending{background:color-mix(in srgb,#d97706 15%,transparent);color:#b45309}
.s-expired{background:color-mix(in srgb,#dc2626 14%,transparent);color:#dc2626}
html[data-theme="dark"] .b-perm{color:#5eead4} html[data-theme="dark"] .b-daily{color:#93b4ff}
html[data-theme="dark"] .b-trial{color:#fbbf24} html[data-theme="dark"] .b-web{color:#c4b5fd}
html[data-theme="dark"] .b-local{color:#94a3b8} html[data-theme="dark"] .s-active{color:#86efac}
html[data-theme="dark"] .s-pending{color:#fbbf24} html[data-theme="dark"] .s-expired{color:#f87171}
.quota{margin-top:11px;font-size:13.5px;font-weight:560;color:var(--ink);line-height:1.55}
.note{margin-top:7px;font-size:12px;color:var(--muted);line-height:1.6;flex:1}
.note.warn{color:#b45309}
html[data-theme="dark"] .note.warn{color:#fbbf24}
.card-foot{margin-top:12px;padding-top:10px;border-top:1px solid var(--line-soft);display:flex;align-items:center;justify-content:space-between;gap:8px}
.tags{display:flex;gap:5px;flex-wrap:wrap}
.tag{font-size:10.5px;color:var(--muted);border:1px solid var(--line);padding:1px 6px;border-radius:4px}
.go{font-size:12px;color:var(--accent);text-decoration:none;font-weight:600;white-space:nowrap;transition:.15s}.go:hover{opacity:.7}
.status-row{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line-soft);display:flex;align-items:center;gap:8px}
.card-stats{margin-left:auto;font-size:11.5px;color:var(--muted);white-space:nowrap}
.card-thumb{margin-top:8px}
.card-thumb img{width:100%;max-height:150px;object-fit:cover;border-radius:8px;display:block}
.more-hint{color:var(--muted);font-size:11.5px}

/* detail */
.crumb{margin:22px 0 6px;font-size:12.5px;color:var(--muted)}
.crumb a{color:var(--accent);text-decoration:none}
.detail{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:28px;margin-top:8px;box-shadow:var(--shadow)}
.detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.detail-head h1{font-size:24px;line-height:1.4;max-width:none;letter-spacing:-.01em}
.detail-head .sub{font-size:13px;color:var(--muted);margin-top:4px}
.badges{display:flex;gap:6px;flex-wrap:wrap;flex-shrink:0}
.expired-banner{margin-top:18px;padding:12px 14px;border-radius:10px;background:color-mix(in srgb,#dc2626 10%,transparent);color:#dc2626;font-size:13px;font-weight:560}
html[data-theme="dark"] .expired-banner{color:#f87171}
.block{margin-top:22px}
.block h2{font-size:14px;font-weight:650;color:var(--ink-2);margin-bottom:8px;border-left:3px solid var(--accent);padding-left:10px}
.quota-lg{font-size:15px;line-height:1.7}
/* 额度巡检结论：三种结论用不同的左侧色条区分，弱化处理不抢正文 */
.verify-line{margin-top:10px;padding:8px 10px;border-radius:8px;font-size:12.5px;line-height:1.6;
  background:var(--line-soft);border-left:3px solid var(--muted);color:var(--ink-2)}
.verify-line b{font-weight:600}
.verify-line.v-still{border-left-color:#16a34a;background:color-mix(in srgb,#16a34a 8%,transparent)}
.verify-line.v-gone{border-left-color:#dc2626;background:color-mix(in srgb,#dc2626 8%,transparent)}
.verify-line.v-unknown{border-left-color:#d97706;background:color-mix(in srgb,#d97706 8%,transparent)}
html[data-theme="dark"] .verify-line.v-still{background:color-mix(in srgb,#16a34a 18%,transparent)}
html[data-theme="dark"] .verify-line.v-gone{background:color-mix(in srgb,#dc2626 18%,transparent)}
html[data-theme="dark"] .verify-line.v-unknown{background:color-mix(in srgb,#d97706 18%,transparent)}
.note-lg{font-size:13.5px;color:var(--ink-2);line-height:1.8}
.tags.lg{gap:8px}
.tags.lg .tag{font-size:12px;padding:3px 9px}
.go.big{display:inline-block;margin-top:4px;padding:10px 18px;border:1px solid var(--accent);border-radius:9px;font-size:13.5px}
.meta{margin-top:24px;padding-top:14px;border-top:1px solid var(--line-soft);font-size:12px;color:var(--muted)}

/* footer */
footer{margin-top:48px;border-top:1px solid var(--line);padding:24px 0 56px;color:var(--muted);font-size:12.5px}
footer .fnote{max-width:760px;line-height:1.75}
footer .fmeta{margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px}
footer .fmeta a{color:var(--ink-2);text-decoration:none}
footer .fmeta a:hover{color:var(--accent);text-decoration:underline}
footer .fmeta i{font-style:normal;color:var(--line)}
footer .fmap{margin-top:10px;display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
footer .fmap a{color:var(--ink-2);text-decoration:none;border-bottom:1px dotted var(--line)}
footer .fmap a:hover{color:var(--accent);border-bottom-color:var(--accent)}
footer .fmap i{font-style:normal;color:var(--line)}
footer b{color:var(--ink-2);font-weight:600}

/* admin */
.admin-wrap{max-width:1080px;margin:0 auto;padding:32px 24px 64px}
.admin-title{font-size:22px;font-weight:700;letter-spacing:-.02em}
.admin-sub{color:var(--muted);font-size:13px;margin-top:6px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin-top:20px;box-shadow:var(--shadow)}
.login-box{max-width:360px;margin:60px auto}
.login-box input{width:100%;height:40px;border-radius:9px;border:1px solid var(--line);background:var(--bg);color:var(--ink);padding:0 12px;font-family:inherit;font-size:14px;margin:8px 0;outline:none}
.login-box input:focus{border-color:var(--accent)}
.login-box .btn[disabled]{opacity:.62;cursor:default}
.btn{background:var(--accent);color:#fff;border:none;height:40px;padding:0 18px;border-radius:9px;font-size:13.5px;font-weight:600;cursor:pointer;font-family:inherit}
.btn.ghost{background:transparent;color:var(--ink-2);border:1px solid var(--line)}
.btn.danger{background:#dc2626;color:#fff}
.btn.sm{height:30px;padding:0 12px;font-size:12px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
table.adm{width:100%;border-collapse:collapse;font-size:13px}
table.adm th,table.adm td{padding:9px 10px;border-bottom:1px solid var(--line-soft);text-align:left;vertical-align:middle}
table.adm th{font-size:12px;color:var(--muted);font-weight:600}
table.adm tr:hover td{background:var(--bg-soft)}
select,input.fld{height:34px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);padding:0 10px;font-family:inherit;font-size:13px;outline:none}
select:focus,input.fld:focus{border-color:var(--accent)}
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.form-grid label{font-size:12px;color:var(--muted);display:block;margin-bottom:4px}
.form-grid input.fld, .form-grid select{width:100%}
.form-grid .full{grid-column:1/-1}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 18px;border-radius:10px;font-size:13px;opacity:0;transition:.25s;pointer-events:none;z-index:99}
.toast.show{opacity:1}
.empty{text-align:center;padding:40px;color:var(--muted)}
.hidden{display:none!important}

/* 富文本编辑器 */
.wysiwyg{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg)}
.wys-toolbar{display:flex;gap:4px;flex-wrap:wrap;padding:7px 8px;border-bottom:1px solid var(--line-soft);background:var(--bg-soft)}
.wys-toolbar button{border:1px solid var(--line);background:var(--card);color:var(--ink-2);min-width:34px;height:30px;padding:0 8px;border-radius:7px;cursor:pointer;font-size:13px;font-family:inherit;transition:.15s}
.wys-toolbar button:hover{border-color:var(--accent);color:var(--accent)}
.wys-editor{min-height:120px;padding:12px 14px;outline:none;font-size:13.5px;line-height:1.75;color:var(--ink)}
.wys-editor:focus{border-color:var(--accent)}
.wys-editor:empty:before{content:"在此输入注意事项，可使用上方工具栏排版…";color:var(--muted)}
.wys-editor a{color:var(--accent)}

/* 图片上传 */
.img-upload{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.img-upload input[type=file]{font-size:12.5px;color:var(--ink-2);max-width:240px}
.img-preview{margin-top:10px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.img-preview img{max-width:160px;max-height:120px;border-radius:10px;border:1px solid var(--line);object-fit:cover}

/* 详情页封面图 */
.detail-img{width:100%;max-height:300px;object-fit:cover;border-radius:var(--radius);margin-top:16px;border:1px solid var(--line)}
.note-lg.muted{color:var(--muted)}
.note-lg a{color:var(--accent)}
.note-lg ul,.note-lg ol{margin:6px 0 6px 22px}
.note-lg h2{font-size:16px;margin:10px 0 4px}
.note-lg code{background:var(--bg-soft);padding:1px 5px;border-radius:5px;font-size:12.5px}

/* 前台互动 */
.interact-sub{font-size:12.5px;color:var(--muted);margin-bottom:12px}
.vote-btns{display:flex;gap:10px;flex-wrap:wrap}
.vote-btns button{border:1px solid var(--line);background:var(--bg);color:var(--ink-2);height:40px;padding:0 16px;border-radius:10px;cursor:pointer;font-size:13.5px;font-family:inherit;font-weight:560;transition:.16s}
.vote-btns button:hover:not(:disabled){border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.vote-btns.done button{cursor:default;opacity:.55}
.vote-btns.done button:hover{border-color:var(--line);color:var(--ink-2);transform:none}
.vote-tally{margin-top:12px;font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.vote-tally .voted-note{color:var(--accent);font-weight:560}

/* 留言区 */
.cmt-count{font-size:13px;background:var(--bg-soft);color:var(--muted);border-radius:20px;padding:1px 10px;margin-left:4px;vertical-align:middle}
.cmt-list{list-style:none;margin:14px 0 0;display:flex;flex-direction:column;gap:12px}
.cmt{background:var(--bg-soft);border:1px solid var(--line-soft);border-radius:12px;padding:12px 14px}
.cmt.is-example{border-style:dashed;background:transparent}
.cmt-empty{color:var(--muted);font-size:13px;text-align:center;padding:18px;border:1px dashed var(--line);border-radius:12px}
.cmt-head{display:flex;align-items:center;gap:8px;font-size:12.5px;margin-bottom:5px}
.cmt-name{font-weight:600;color:var(--ink)}
.cmt-date{color:var(--muted);margin-left:auto}
.cmt-ex{font-size:11px;color:#9a6700;background:#fff4d6;border:1px solid #f3e0a3;border-radius:6px;padding:1px 6px;font-weight:600}
.cmt-text{font-size:14px;color:var(--ink-2);white-space:normal;word-break:break-word}
.cmt-form{margin-top:16px;display:flex;flex-direction:column;gap:10px}
.cmt-name{max-width:240px}
.cmt-text{resize:vertical;min-height:64px;font-family:inherit;font-size:14px}
.cmt-form-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}
.cmt-form-foot .hint{font-size:12.5px;color:var(--muted)}
input.fld,textarea.fld,input.cmt-name,textarea.cmt-text{background:var(--card);border:1px solid var(--line);color:var(--ink);border-radius:10px;padding:10px 12px;font-size:14px;outline:none;transition:.16s}
input.fld:focus,textarea.fld:focus,input.cmt-name:focus,textarea.cmt-text:focus{border-color:var(--accent)}
button.btn.sm:disabled{opacity:.5;cursor:not-allowed}

/* 后台评论管理 / 审核配置 */
.comments-mgr .cmt-row{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--line)}
.comments-mgr .cmt-row .meta{font-size:12px;color:var(--muted);min-width:150px}
.comments-mgr .cmt-row .body{flex:1;font-size:13px}
.comments-mgr .cmt-row .body .ex{font-size:11px;color:#9a6700;background:#fff4d6;border:1px solid #f3e0a3;border-radius:6px;padding:0 5px;margin-left:6px}
.cfg-box{border:1px solid var(--line);border-radius:12px;padding:16px;background:var(--bg-soft)}
.cfg-box label{font-size:12.5px;color:var(--ink-2);display:block;margin:10px 0 4px}
.cfg-box .row{display:flex;gap:10px;flex-wrap:wrap}

/* 富文本图片：详情与卡片内图片自适应不溢出，详情页可点击放大 */
.note-lg img,.detail-img{max-width:100%;max-height:78vh;height:auto;border-radius:10px;display:block}
.detail-img{margin:6px 0 2px;cursor:zoom-in}
.note-lg img{cursor:zoom-in}
.card .note img{max-width:100%;max-height:130px;width:auto;border-radius:8px;display:inline-block;vertical-align:middle}
.card .note a{color:var(--accent);text-decoration:underline;word-break:break-all}

/* 图片灯箱 */
.lightbox{position:fixed;inset:0;background:rgba(10,12,16,.93);z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center}
.lightbox.hidden{display:none!important}
.lightbox .lb-top{position:absolute;top:14px;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:0 18px}
.lightbox .lb-count{color:#fff;font-size:13px;opacity:.85}
.lightbox .lb-img{max-width:92vw;max-height:80vh;object-fit:contain;border-radius:6px;box-shadow:0 10px 40px rgba(0,0,0,.5);transform-origin:center center;transition:transform .15s ease}
.lightbox .lb-bar{position:absolute;bottom:22px;display:flex;gap:8px;align-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:8px 14px;backdrop-filter:blur(6px)}
.lightbox .lb-sep{width:1px;height:16px;background:rgba(255,255,255,.25)}
.lb-btn{background:transparent;border:none;color:#fff;font-size:13px;padding:5px 10px;border-radius:8px;cursor:pointer;transition:.15s;font-family:inherit}
.lb-btn:hover{background:rgba(255,255,255,.18)}

@media (max-width:760px){
  .wrap{padding:0 18px} .hero{padding:36px 0 24px} .stats{grid-template-columns:repeat(2,1fr)}
  .form-grid{grid-template-columns:1fr} .detail{padding:18px}
  table.adm{font-size:12px} .detail-head h1{font-size:23px}
}

/* 教程 tabs（详情页）：申请教程 / 使用教程 切换展示，节省纵向空间 */
.tut-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tut-tab{border:1px solid var(--line);background:var(--bg);color:var(--ink-2);padding:7px 16px;border-radius:9px;cursor:pointer;font-size:13px;font-weight:600;transition:.16s}
.tut-tab:hover{border-color:var(--accent)}
.tut-tab.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.tut-pane{display:none;font-size:14.5px;line-height:1.85;color:var(--ink-2)}
.tut-pane.on{display:block}
.tut-pane img{max-width:100%;height:auto;border-radius:8px;margin:10px 0 12px;border:1px solid var(--line);background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06);cursor:zoom-in}
.tut-pane h2,.tut-pane h3{font-size:16px;margin:14px 0 6px}
.tut-pane ul,.tut-pane ol{padding-left:22px;margin:6px 0}
.tut-pane a{color:var(--accent)}

/* 代码：行内 code 与整块 pre>code 保持等宽、保留换行与缩进 */
.tut-pane code,.note-lg code{font-family:"JetBrains Mono","SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;font-size:12.8px;background:var(--bg-soft);border:1px solid var(--line-soft);padding:1px 5px;border-radius:5px;color:var(--ink);word-break:break-word}
.tut-pane pre,.note-lg pre{position:relative;margin:12px 0;padding:14px 15px;background:var(--bg-soft);border:1px solid var(--line);border-radius:10px;overflow-x:auto;line-height:1.62;-webkit-overflow-scrolling:touch}
.tut-pane pre code,.note-lg pre code{display:block;min-width:max-content;padding:0;background:none;border:0;border-radius:0;color:var(--ink);font-size:12.8px;white-space:pre;tab-size:2;-moz-tab-size:2}
.tut-pane pre code::selection,.note-lg pre code::selection{background:color-mix(in srgb,var(--accent) 26%,transparent)}
.code-block .code-copy{position:absolute;top:7px;right:7px;z-index:2;font-size:11.5px;line-height:1;padding:5px 8px;border-radius:6px;border:1px solid var(--line);background:var(--card);color:var(--muted);cursor:pointer;opacity:0;transition:.15s}
.code-block:hover .code-copy,.code-block:focus-within .code-copy{opacity:1}
.code-block .code-copy:hover{color:var(--accent);border-color:var(--accent)}
.code-block .code-copy.done{color:#16a34a;border-color:#16a34a;opacity:1}

/* 置顶卡片 */
.card.is-pinned{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,var(--card)),var(--card))}
.pin-badge{display:inline-block;font-size:10.5px;font-weight:700;color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);border-radius:6px;padding:1px 7px;margin-right:6px;vertical-align:2px;white-space:nowrap}
.note-plain{white-space:normal;word-break:break-word}

/* 品牌与分组标题改为链接后的样式归一 */
.topbar a.brand{color:inherit;text-decoration:none}
.topbar a.brand:hover .dot{transform:scale(1.15)}
.group-head h2 a{color:inherit;text-decoration:none}
.group-head h2 a:hover{color:var(--accent)}

/* 详情页：上一篇 / 下一篇 */
.pn-nav{display:flex;gap:12px;margin:26px 0 8px}
.pn-nav .pn{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;padding:13px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);text-decoration:none;transition:.16s;box-shadow:var(--shadow)}
.pn-nav .pn small{font-size:11px;color:var(--muted)}
.pn-nav .pn span{font-size:13.5px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pn-nav .pn.next{text-align:right}
.pn-nav .pn:hover{border-color:var(--accent)}
.pn-nav .pn:hover span{color:var(--accent)}
.pn-nav .pn.ghost{background:transparent;border-style:dashed;box-shadow:none;visibility:hidden}
@media (max-width:560px){.pn-nav{flex-direction:column}.pn-nav .pn.next{text-align:left}}

/* 详情页：分享条 */
.share-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:14px 0 4px;padding-top:12px;border-top:1px dashed var(--line-soft);position:relative}
.share-bar .sh-label{font-size:12px;color:var(--muted)}
.share-bar .sh-btn{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);background:var(--bg);color:var(--ink-2);border-radius:999px;padding:5px 13px;font-size:12px;font-weight:560;cursor:pointer;text-decoration:none;font-family:inherit;transition:.15s}
.share-bar .sh-btn:hover{border-color:var(--accent);color:var(--accent)}
.share-bar .sh-tip{font-size:12px;color:#16a34a;font-weight:600}
.share-bar .sh-pop{position:absolute;top:calc(100% + 10px);left:0;z-index:30;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 38px rgba(0,0,0,.16);padding:14px 16px;max-width:min(420px,92%)}
.share-bar .sh-pop p{margin:0 0 8px;font-size:12.5px;color:var(--ink-2)}
.share-bar .sh-pop code{display:block;font-family:"JetBrains Mono",Consolas,monospace;font-size:12px;background:var(--bg-soft);border:1px solid var(--line-soft);border-radius:8px;padding:8px 10px;word-break:break-all;margin-bottom:10px;color:var(--ink)}

/* ---------- 语法高亮（highlight.js，本地自托管 /vendor/highlight.min.js） ----------
 * 不引入官方主题 CSS（单主题无法适配本站深浅双主题），token 配色用站点变量写在两套主题里。
 * 背景仍由 .tut-pane pre / .note-lg pre 的 var(--bg-soft) 控制，hljs 不另设背景。 */
:root{
  --code-kw:#cf222e; --code-str:#0a3069; --code-cmt:#6e7781; --code-num:#0550ae;
  --code-fn:#8250df; --code-type:#116329; --code-var:#953800; --code-tag:#116329;
}
html[data-theme="dark"]{
  --code-kw:#ff7b72; --code-str:#a5d6ff; --code-cmt:#8b949e; --code-num:#79c0ff;
  --code-fn:#d2a8ff; --code-type:#7ee787; --code-var:#ffa657; --code-tag:#7ee787;
}
.hljs{color:var(--ink)}
.hljs-comment,.hljs-quote{color:var(--code-cmt);font-style:italic}
.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-doctag,.hljs-name,.hljs-tag{color:var(--code-kw)}
.hljs-string,.hljs-regexp,.hljs-addition,.hljs-attribute,.hljs-meta .hljs-string,.hljs-template-tag{color:var(--code-str)}
.hljs-number,.hljs-symbol,.hljs-bullet,.hljs-variable,.hljs-template-variable,.hljs-attr,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-selector-pseudo,.hljs-meta{color:var(--code-num)}
.hljs-title,.hljs-title.function_,.hljs-title.class_,.hljs-section{color:var(--code-fn)}
.hljs-type,.hljs-built_in,.hljs-builtin-name,.hljs-class .hljs-title,.hljs-title.class_.inherited__{color:var(--code-type)}
.hljs-variable.language_,.hljs-params{color:var(--code-var)}
.hljs-deletion{color:#e5534b;background:rgba(228,54,58,.12)}
.hljs-emphasis{font-style:italic}
.hljs-strong{font-weight:600}
.hljs-subst,.hljs-operator{color:var(--ink-2)}