/* M1 增补：SSR 页面特有的结构与表单样式。基础视觉全部来自 arknights.css，不覆盖原规范。 */

/* 归档 / 关于 两页的分区导航：纯锚点，不依赖 JS */
.idx-nav{display:flex;flex-wrap:wrap;align-items:stretch;border:1px solid var(--line);background:var(--panel);margin:0 0 26px}
.idx-nav a{display:flex;align-items:center;gap:9px;padding:11px 16px;border-right:1px solid var(--line2);font-size:12.5px;color:var(--hi);letter-spacing:.04em;transition:.2s}
.idx-nav a:hover{background:var(--y-dim);color:var(--y)}
.idx-nav a .no{font-family:var(--mono);font-size:9px;color:var(--dim2);letter-spacing:.12em}
.idx-nav a em{font-style:normal;font-family:var(--mono);font-size:10px;color:var(--dim2);padding:1px 5px;border:1px solid var(--line)}
.idx-nav a:hover em{border-color:var(--y);color:var(--y)}
.idx-nav-note{margin-left:auto;display:flex;align-items:center;padding:0 14px;font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;color:var(--dim2)}

.idx-sec{scroll-margin-top:74px;margin-bottom:38px}
.idx-sec:last-child{margin-bottom:0}
.idx-sec-hd{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding-left:11px;border-left:3px solid var(--y)}
.idx-sec-hd h3{margin:0;font-family:var(--mono);font-size:12.5px;font-weight:500;letter-spacing:.16em;color:var(--hi)}
.idx-sec-hd .note{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;color:var(--dim2);line-height:1.7}
.idx-sec .cat-grid,.idx-sec .link-grid{margin:0}
.idx-sec .cat-grid{margin-bottom:-1px;align-items:start}
.idx-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;color:var(--dim2);margin-bottom:7px}
.back-link{margin:-4px 0 16px}
.back-link a{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;color:var(--dim);border:1px solid var(--line);padding:4px 10px;transition:.2s}
.back-link a:hover{color:var(--y);border-color:var(--y);background:var(--y-dim)}

/* 等宽字体栈里没有中文，补中文回退，保证按钮文字在所有环境可读 */
.btn,.chip,.act,.flag,.big-act{font-family:var(--mono),"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif}

.search-input button.k{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--dim2);border:1px solid var(--line2);padding:3px 7px}
.search-input button.k:hover{color:var(--y);border-color:var(--y)}

.fld{width:100%;padding:9px 11px;background:var(--bg2);border:1px solid var(--line);color:var(--hi);font-family:var(--sans);font-size:13px;outline:none}
.fld:focus{border-color:var(--y)}
textarea.fld{resize:vertical;line-height:1.8}
.form-grid{display:grid;gap:14px;max-width:560px}
.form-label{font-family:var(--mono);font-size:11px;color:var(--dim);letter-spacing:.06em;display:block}
.form-label .fld{margin-top:6px}
.form-err{color:var(--red);font-size:11px}
.flash{display:block;padding:9px 11px;margin-bottom:14px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;border:1px solid var(--y);background:var(--y-dim);color:var(--hi)}
.flash.err{border-color:var(--red);color:var(--red);background:transparent}

/* 关于页：邮箱 + 表单左右并置，窄屏自动上下堆叠 */
.contact-card{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:26px;padding:24px 24px 26px}
.contact-side{border-right:1px solid var(--line2);padding-right:26px}
.c-label{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;color:var(--dim2)}
.mail-big{display:inline-block;margin-top:8px;font-family:var(--mono);font-size:14.5px;color:var(--y);word-break:break-all;border-bottom:1px dashed var(--y);line-height:1.6}
.mail-big:hover{color:var(--hi);border-bottom-style:solid}
.c-hint{margin:14px 0 0;font-size:12px;color:var(--dim);line-height:1.9}
.c-meta{margin-top:18px}
.c-meta .stat-row{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dashed var(--line2);font-size:11px}
.c-meta .stat-row span{color:var(--dim2);font-family:var(--mono);font-size:10px;letter-spacing:.06em}
.c-meta .stat-row b{font-weight:400;color:var(--txt)}
.contact-form .form-grid{max-width:none}
.mail-link{color:var(--y);border-bottom:1px dashed var(--y-dim);word-break:break-all}
.mail-link:hover{color:var(--hi)}
.side .p-meta b .mail-link{font-size:10px}
/* .p-meta b 的 color 优先级高于 .mail-link，这里补一条让邮箱保持可点击的荧光黄 */
.p-meta b .mail-link{color:var(--y)}
.p-meta b .mail-link:hover{color:var(--hi)}
/* 邮箱由脚本拼接：拼好之前只显示占位文案，样式上区分一下，避免看起来像真地址 */
.mail-js:not([data-ready]) .mail-txt{color:var(--dim2);border-bottom-style:dotted;letter-spacing:.02em}
.mail-js.ico-only{color:var(--dim)}
@media(max-width:820px){
  .contact-card{grid-template-columns:minmax(0,1fr);gap:18px}
  .contact-side{border-right:0;padding-right:0;border-bottom:1px solid var(--line2);padding-bottom:16px}
}

.pager{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:18px 0 60px;font-family:var(--mono);font-size:11px}
.pager a,.pager span{padding:6px 11px;border:1px solid var(--line);color:var(--dim)}
.pager a:hover{border-color:var(--y);color:var(--y)}
.pager .cur{background:var(--y);border-color:var(--y);color:#111}
.pager .info{margin-left:auto;border:0;color:var(--dim2);padding:0}

.arch-group{margin-bottom:24px}
.arch-month{display:flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.16em;color:var(--y);margin-bottom:8px}
.arch-month::after{content:"";flex:1;height:1px;background:var(--line2)}

.tag-cloud{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.tag-cloud a{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border:1px solid var(--line);font-family:var(--mono);font-size:12px;color:var(--hi);transition:.2s}
.tag-cloud a:hover{border-color:var(--y);color:var(--y);background:var(--y-dim)}
.tag-cloud em{font-style:normal;font-size:10px;color:var(--dim2)}

.cat-card{border:1px solid var(--line);background:var(--panel);padding:16px 18px;margin-bottom:-1px}
.cat-card .cc-h{display:flex;align-items:baseline;gap:12px;margin-bottom:10px}
.cat-card .cc-h b{font-family:var(--mono);font-size:14px;color:var(--hi);letter-spacing:.08em}
.cat-card .cc-h em{font-style:normal;font-family:var(--mono);font-size:10px;color:var(--dim2);margin-left:auto}
.cat-card ul{list-style:none;margin:0;padding:0}
.cat-card li{border-top:1px solid var(--line2);padding:7px 0;font-size:13px}
.cat-card li a:hover{color:var(--y)}

.gb-item,.cmt-item{border:1px solid var(--line);background:var(--panel);padding:14px 16px;margin-bottom:-1px}
.gb-head,.cmt-line{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:10px;color:var(--dim2);letter-spacing:.08em}
.gb-name,.cmt-name{color:var(--hi);font-size:12px}
.gb-text,.cmt-text{margin-top:8px;font-size:13px;line-height:1.9;color:var(--txt);overflow-wrap:anywhere}
.gb-tag{font-family:var(--mono);font-size:9px;border:1px solid var(--line);padding:1px 6px;color:var(--dim2)}

.post-body h2{scroll-margin-top:80px}
.post-body table{border-collapse:collapse;width:100%;margin:16px 0;font-size:13px}
.post-body th,.post-body td{border:1px solid var(--line);padding:7px 10px;text-align:left}
.post-body th{background:var(--bg2);color:var(--hi)}
.post-body img{max-width:100%;height:auto;border:1px solid var(--line)}
.post-body blockquote{margin:16px 0;padding:10px 16px;border-left:3px solid var(--y);background:var(--y-dim);color:var(--txt)}
.post-body a{color:var(--b);border-bottom:1px dashed var(--b)}
.post-body a:hover{color:var(--y);border-bottom-color:var(--y)}
.comment-zone .form-grid{max-width:none}

.shortcut-modal{display:none;position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.72);align-items:center;justify-content:center}
.shortcut-modal.on{display:flex}
.sk-in{width:min(420px,92vw);background:var(--solid);border:1px solid var(--line);padding:18px 22px 22px}
.sk-hd{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:var(--y);border-bottom:1px solid var(--line2);padding-bottom:12px;margin-bottom:12px}
.sk-hd button{margin-left:auto;color:var(--dim)}
.sk-row{display:flex;align-items:center;gap:14px;padding:6px 0;font-size:12px;color:var(--dim)}
.sk-row kbd{font-family:var(--mono);font-size:11px;min-width:42px;text-align:center;padding:3px 6px;border:1px solid var(--line);color:var(--hi)}

.notice-line{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--dim);line-height:1.9}
.side .panel-bd a.p-more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:var(--y)}
.share-card{width:min(520px,88vw);border:1px solid var(--y);background:var(--bg);padding:26px 28px}
.share-card .sc-no{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--y)}
.share-card h3{margin:14px 0 10px;font-size:22px;color:var(--hi);line-height:1.5}
.share-card p{font-size:12px;color:var(--dim);line-height:1.9}
.share-card .sc-foot{margin-top:22px;padding-top:12px;border-top:1px solid var(--line2);font-family:var(--mono);font-size:10px;color:var(--dim2);letter-spacing:.12em}

body[data-font="large"] .post-body,body[data-font="large"] .card-excerpt{font-size:15px}
body[data-density="compact"] .card{padding-top:12px;padding-bottom:0}
body[data-density="compact"] .card-meta{margin-top:8px}
body[data-motion="off"] *,body[data-motion="off"] *::before,body[data-motion="off"] *::after{animation:none!important;transition:none!important}
html[data-accent="blue"]{--y:#22bbff;--y-dim:rgba(34,187,255,.12)}
html[data-accent="white"]{--y:#eaeaea;--y-dim:rgba(234,234,234,.1)}

.timeline{border-left:1px solid var(--line);margin-left:6px;padding-left:18px}
.tl-item{position:relative;padding:0 0 18px}
.tl-item::before{content:"";position:absolute;left:-23px;top:6px;width:7px;height:7px;background:var(--y);border:1px solid var(--bg)}
.tl-y{font-size:10px;letter-spacing:.14em;color:var(--y)}
.tl-item b{display:block;margin-top:3px;font-size:13px;color:var(--hi);font-weight:500}
.tl-item p{line-height:1.8}

body[data-immersive="on"] .side,
body[data-immersive="on"] .topbar,
body[data-immersive="on"] footer,
body[data-immersive="on"] .fab-stack{display:none}
body[data-immersive="on"] .grid{grid-template-columns:minmax(0,1fr)}
body[data-immersive="on"] .hero{display:none}

/* Markdown 输出的是裸 <pre>，不是原型的 .code-wrap，这里让复制按钮默认可见 */
.post-body pre .code-copy{opacity:.62}
.post-body pre:hover .code-copy{opacity:1}

/* #fx 演示入口：保留标记不淡出，便于视觉验收 */
body[data-fx-demo="on"] .cfx-lock,
body[data-fx-demo="on"] .cfx-lock::after,
body[data-fx-demo="on"] .cfx-box,
body[data-fx-demo="on"] .cfx-tag{animation:none!important;opacity:1!important}

@media(max-width:560px){
  .cover svg{max-width:100%}
  .card-excerpt{overflow-wrap:anywhere}
  .card-meta{overflow-wrap:anywhere}
}

@media(max-width:900px){
  .nav a{padding:0 9px;font-size:12px}
  .idx-nav-note{display:none}
}