/* 基础重置、body 字体与配色统一由 /assets/theme.css 提供，此处只保留页面级布局 */
a{color:inherit;text-decoration:none;cursor:pointer}
.top{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.top-inner{max-width:860px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:12px 18px}
.logo{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.logo-mark{width:26px;height:26px;border-radius:7px;flex:none;box-shadow:0 1px 3px rgba(20,30,60,.18)}
.logo-text{font-weight:800;color:var(--brand);font-size:18px;letter-spacing:.2px;white-space:nowrap}
.nav{display:flex;gap:6px;margin-left:8px}
.nav a{padding:7px 14px;border-radius:9px;font-size:14px;font-weight:600;color:#33405a}
.nav a.active{background:var(--brand);color:#fff}
.userbox{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:13.5px}
.container{max-width:860px;margin:0 auto;padding:20px 18px 60px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow);margin-bottom:14px}
.btn{background:var(--brand);color:#fff;border:none;padding:8px 16px;border-radius:8px;font-size:13.5px;font-weight:600;cursor:pointer}
.btn.ghost{background:#fff;color:var(--brand);border:1px solid var(--brand)}
.btn.sm{padding:5px 12px;font-size:12.5px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.field{margin-bottom:12px}
.field label{display:block;font-size:13px;font-weight:600;color:#33405a;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;max-width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:9px;font-size:14px;outline:none;font-family:inherit}
.field textarea{resize:vertical;min-height:130px;display:block}
.field input:focus,.field textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.hint{font-size:12px;color:var(--sub);margin-top:6px}
.notice{background:#eef6ff;border:1px solid #cfe0ff;color:#2a4fa0;font-size:12.5px;padding:10px 12px;border-radius:10px;margin-bottom:14px;line-height:1.7}
.notice b{font-weight:700}
.err{color:var(--bad);font-size:12.5px;min-height:16px;margin-top:6px}
/* 登记表单：字段级实时校验提示（用户名/学号/姓名/密码/手机号/邮箱） */
.field-tip{font-size:12px;color:var(--bad);min-height:16px;margin-top:4px}
.field input.is-bad{border-color:var(--bad)}
.field input.is-bad:focus{border-color:var(--bad);box-shadow:0 0 0 3px rgba(214,69,61,.14)}
/* 警示性说明文案（如手机号防误输提示） */
.hint.warn{color:var(--warn)}
.row{display:flex;gap:10px}.row>*{flex:1}
.post-head{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:14px}
.avatar.male{background:#4a90e2}.avatar.female{background:#e26aa0}.avatar.anon{background:#9aa5b5}
.name{font-weight:700;font-size:14px}
.tag-type{font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;background:var(--brand-soft);color:var(--brand)}
.tag-anon{font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;background:#eee;color:#777}
.post-content{font-size:15px;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;margin:4px 0 10px}
.post-foot{display:flex;align-items:center;gap:16px;color:var(--sub);font-size:13px}
.post-foot .act{cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:9px;transition:background .15s}
.post-foot .act:hover{background:var(--brand-soft)}
.post-foot .act.liked{color:var(--bad)}
.tabs{display:flex;gap:8px;margin-bottom:14px}
.pending{font-size:11px;color:var(--warn);font-weight:700}
.empty{padding:30px;text-align:center;color:var(--sub)}
/* ============ 评论区排版（清晰的四层视觉层级） ============
 * 层级：用户名(15px/700/#1f2733) > 评论正文(15.5px/#2b3440, 行高1.75)
 *       > 操作按钮(13.5px/#5b6675) > 时间戳(12.5px/#8a94a6)
 * 通过字号 + 字重 + 颜色深浅三重区分，解决原先「名字与正文同字号、挤在一行」的阅读问题。
 */
.c-title{font-size:16px;font-weight:800;margin:0 0 14px;display:flex;align-items:center;gap:8px}
.c-title-num{font-size:12.5px;font-weight:700;color:var(--brand);background:var(--brand-soft);padding:2px 9px;border-radius:999px}
.comments{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}
.c-empty{padding:22px 0;font-size:14px}
.comment{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid #f1f3f8}
.comment:last-child{border-bottom:none;padding-bottom:2px}
.comment .avatar{width:42px;height:42px;font-size:15px;flex:0 0 auto}
.c-body{flex:1;min-width:0}
/* 第 1 层：用户名 + 时间 */
.c-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:5px}
.c-name{font-size:15px;font-weight:700;color:#1f2733;letter-spacing:.2px;line-height:1.4}
.c-anon{font-size:11px;padding:1px 7px}
.c-time{margin-left:auto;font-size:12.5px;color:#8a94a6;letter-spacing:.2px;white-space:nowrap}
/* 第 2 层：评论正文（加大字号 + 加大行高 + 提高对比度） */
.c-text{font-size:15.5px;line-height:1.75;letter-spacing:.2px;color:#2b3440;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}
/* 第 3 层：操作区（与正文明显区分：更小、更浅、可点击有反馈） */
.c-actions{display:flex;align-items:center;gap:6px;margin-top:8px}
.c-act{display:inline-flex;align-items:center;gap:6px;background:none;border:none;padding:6px 10px;border-radius:9px;
  font-family:inherit;font-size:13.5px;font-weight:600;color:#5b6675;cursor:pointer;transition:background .15s,color .15s}
.c-act:hover{background:var(--brand-soft);color:var(--brand)}
.c-act .ico{font-size:16px;line-height:1}
.c-act .cnt{font-size:13px;font-weight:700}
.c-act.c-like.liked{color:var(--bad)}
.c-act.c-like.liked .ico{color:var(--bad)}
.toast{position:fixed;top:18px;left:50%;transform:translateX(-50%);background:#1f2733;color:#fff;padding:10px 18px;border-radius:10px;font-size:13.5px;opacity:0;pointer-events:none;transition:.25s;z-index:99}
.toast.show{opacity:1}.toast.ok{background:var(--ok)}.toast.bad{background:var(--bad)}
.center{max-width:420px;margin:40px auto}

/* ============ 图标与控件增强 ============ */
/* 点赞 / 评论图标放大，数字单独控制尺寸，整体更清晰易点 */
.post-foot .ico{font-size:19px;line-height:1}
.post-foot .cnt{font-size:13.5px;font-weight:600}
.post-foot .act.like .ico{font-size:21px}
.post-foot .act.like.liked .ico{color:var(--bad)}
/* 复选框放大并主题色化 */
.field input[type="checkbox"]{width:20px;height:20px;accent-color:var(--brand);flex:0 0 auto;cursor:pointer;margin:0}
/* 匿名发布：复选框置左 + 卡片化，提升可见性与点击区域 */
.anon-check{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:400;cursor:pointer;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fafbff;margin-bottom:12px}
/* 匿名复选框本身：与 .field 内复选框一致地放大并主题色化（该 label 不在 .field 内，需单独声明） */
.anon-check input[type="checkbox"]{width:20px;height:20px;accent-color:var(--brand);flex:0 0 auto;cursor:pointer;margin:0}
/* 点击整块区域即可切换：整块 label 为可点击区，span 撑满剩余宽度 */
.anon-check span{flex:1;min-width:0}

/* ============ 图片上传组件 ============ */
.up-box{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.up-tip{font-size:12px;color:var(--sub)}
.up-preview{margin-top:10px}
.up-preview img{max-width:100%;max-height:260px;border-radius:10px;display:block;border:1px solid var(--line);background:#f2f4f8}
.up-preview .btn{margin-top:8px}
.up-bar{height:6px;background:#eef1f7;border-radius:4px;overflow:hidden;margin-top:10px}
.up-bar i{display:block;height:100%;width:0;background:var(--brand);transition:width .2s}
.up-meta{font-size:12.5px;color:var(--sub);margin-top:8px;line-height:1.7}
/* 帖子配图：限高避免长图刷屏 */
.post-img{display:block;max-width:100%;max-height:420px;border-radius:10px;margin:8px 0;background:#f2f4f8;object-fit:cover;cursor:pointer}

/* ============ 首页信息卡片网格（等宽 / 等高 / 对齐） ============
 * 等高由三层保证，缺一不可：
 *  1) grid-auto-rows:1fr —— 同一网格内所有行高一致（取该行最高卡片）；
 *  2) 媒体区固定宽高比（aspect-ratio）—— 宽度相同则高度必然相同；
 *  3) 摘要固定 3 行（line-clamp + min-height）—— 文本长短不再影响高度。
 * 配合卡片内部 flex 布局与 margin-top:auto 的底部栏，视觉上严格对齐。
 */
.container.grid-view{max-width:1100px}
.post-grid{display:grid;gap:14px;grid-template-columns:1fr;grid-auto-rows:1fr}
/* 无配图卡片：占满同样的媒体区空间，保证有图/无图高度一致 */
.post-grid .empty,.post-grid .grid-full{grid-column:1/-1}
/* 悬浮反馈沿用 .card:hover 的统一规则（在文件后段定义），此处不重复声明 */
.post-card{display:flex;flex-direction:column;height:100%;margin:0;padding:0;overflow:hidden;cursor:pointer}
/* 媒体区：统一 4:3 裁剪，图片居中铺满不变形 */
.post-media{position:relative;flex:0 0 auto;width:100%;aspect-ratio:4 / 3;overflow:hidden;background:linear-gradient(135deg,#eef1f8 0%,#f7f9fd 100%)}
/* 真实照片与内联 SVG 占位图共用同一套尺寸：铺满媒体区、同比例裁剪、圆角由父级裁切，
 * 因此有图 / 无图卡片的外观完全一致（等宽等高、圆角一致）。 */
.post-media-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.post-media-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
/* 卡片主体：统一内边距；min-width:0 保证文字可省略而不撑破布局 */
.post-card-body{flex:1 1 auto;display:flex;flex-direction:column;min-width:0;padding:12px 14px}
.post-head-meta{flex:1;min-width:0}
/* 标题：固定 1 行 + 固定字体，超出省略号 */
.post-card .name{font-size:14px;font-weight:700;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 摘要：固定 3 行，超出以省略号结尾 */
.post-summary{margin-top:6px;font-size:14px;line-height:1.65;color:#39424f;white-space:normal;overflow-wrap:anywhere;word-break:break-word;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;
  min-height:calc(3 * 1.65em)}
/* 底部栏贴底对齐，各卡片底边严格在同一水平线 */
.post-card .post-foot{margin-top:auto;padding:10px 14px;border-top:1px solid var(--line);gap:12px;
  flex-wrap:wrap;min-width:0}   /* 允许换行：避免内容较多时溢出被 overflow:hidden 裁掉 */
.post-card .post-time{margin-left:auto;font-size:12.5px;white-space:nowrap;min-width:0}
.post-card .post-head{gap:8px;min-width:0}   /* 头部容纳举报按钮后仍允许昵称省略 */

/* ============ 站内信箱 ============ */
/* 顶部入口：信箱 + 未读红点（数字角标） */
.ib-link{position:relative;display:inline-flex;align-items:center;gap:5px;font-size:13.5px;font-weight:600;color:#33405a;cursor:pointer}
.ib-link:hover{color:var(--brand)}
.ib-badge{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--bad);color:#fff;
  font-size:11px;font-weight:700;font-style:normal;line-height:18px;text-align:center;box-shadow:0 0 0 2px #fff}
.inbox-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.inbox-head .c-title{margin:0}
/* 筛选 Tab：全部 / 未读 */
.tabs .tab{padding:6px 14px;border-radius:9px;font-size:13.5px;font-weight:600;color:#33405a;cursor:pointer;background:#f2f4f9}
.tabs .tab.active{background:var(--brand);color:#fff}
.tabs .tab:hover:not(.active){background:var(--brand-soft);color:var(--brand)}
/* 通知条目：头像 + 触发者/文案 + 摘要 + 类型/时间 */
.notif{display:flex;gap:12px;padding:14px 12px;border-radius:12px;cursor:pointer;transition:background .15s}
.notif:hover{background:#f7f9fd}
.notif+.notif{border-top:1px solid #f1f3f8}
.notif.unread{background:#fff8f8}
.notif.unread:hover{background:#fff2f2}
.notif .avatar{width:40px;height:40px;font-size:14px;flex:0 0 auto}
.n-body{flex:1;min-width:0}
.n-line{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.n-actor{font-size:15px;font-weight:700;color:#1f2733}
.n-text{font-size:14.5px;color:#3c4655}
.n-dot{width:8px;height:8px;border-radius:50%;background:var(--bad);flex:0 0 auto;margin-left:2px}
.n-snippet{margin-top:4px;font-size:13.5px;line-height:1.6;color:#5b6675;overflow-wrap:anywhere;word-break:break-word;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.n-snippet.n-gone{color:var(--sub);font-style:italic}
.n-foot{display:flex;align-items:center;gap:10px;margin-top:6px}
.n-type{font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;background:var(--brand-soft);color:var(--brand)}
.n-time{font-size:12.5px;color:#8a94a6;margin-left:auto}
.inbox-more{margin-top:14px;text-align:center}
/* 从信箱跳转到详情时，目标评论高亮 3 秒 */
.comment.hl{background:#fff8e6;padding-left:12px;padding-right:12px;border-radius:12px;box-shadow:inset 3px 0 0 var(--warn);transition:background .3s}

/* ============ 视觉打磨：统一交互反馈 ============ */
.top{box-shadow:0 2px 10px rgba(31,39,51,.05)}
.nav a{transition:background .15s,color .15s}
.nav a:hover{background:var(--brand-soft);color:var(--brand)}
.nav a.active:hover{background:var(--brand);color:#fff}
.btn{transition:filter .15s,transform .05s}
.btn:hover{filter:brightness(1.06)}
.btn:active{transform:translateY(1px)}
.card{transition:box-shadow .2s}
.card:hover{box-shadow:0 6px 22px rgba(31,39,51,.10)}
.field input,.field select,.field textarea{transition:border-color .15s,box-shadow .15s}
.userbox a{color:#33405a;transition:color .15s}
.userbox a:hover{color:var(--brand)}
.toast{box-shadow:0 6px 20px rgba(0,0,0,.18)}

/* ============ 响应式适配 ============ */
/* 平板及以上：内容区适当加宽，阅读更舒适 */
@media (min-width:768px){
  .top-inner,.container{max-width:920px}
}
/* 桌面大屏：限制最大宽度并居中，避免单行过长 */
@media (min-width:1200px){
  .top-inner,.container{max-width:960px}
}
/* 卡片网格：按屏宽自动排布列数，始终等宽等高
 *  <560px 单列（手机）；560~899px 自适应两列起；≥900px 更宽的卡片
 */
@media (min-width:560px){
  .post-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
}
@media (min-width:900px){
  .post-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
}

/* 手机端：紧凑布局，防止导航与按钮溢出 */
@media (max-width:600px){
  .top-inner{flex-wrap:wrap;align-items:center;gap:8px 10px;padding:10px 12px}
  .logo{flex:1 1 auto;min-width:0}
  .userbox{margin-left:auto;font-size:12.5px;gap:6px}
  .nav{order:3;width:100%;margin-left:0;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .nav a{padding:6px 11px;font-size:13px;white-space:nowrap}
  .container{padding:14px 12px 56px}
  .card{padding:14px}
  /* 网格卡片内边距由内部区域自行控制，整体必须置 0，否则会覆盖基础规则的 padding:0 */
  .post-card{padding:0}
  .post-grid{gap:12px}
  /* 手机单列：媒体区改 16:9，卡片更紧凑（同列所有卡片比例一致，仍然等高） */
  .post-media{aspect-ratio:16 / 9}
  .post-summary{font-size:13.5px}
  .post-content{font-size:14.5px}
  .name{font-size:13.5px}
  .btn{padding:9px 16px;font-size:13.5px}
  .btn.sm{padding:6px 12px}
  /* 表单控件字号 >=16px，避免 iOS 聚焦时自动放大页面 */
  .field input,.field select,.field textarea{font-size:16px;padding:11px 12px}
  .row{flex-direction:column;gap:8px}
  .row>*{flex:auto}
  /* 头像与间距略缩，节省手机横向空间 */
  .avatar{width:34px;height:34px;font-size:13px}
  .post-foot{gap:12px;font-size:12.5px}
  /* 评论区：手机上保持可读的前提下收紧间距，多条堆叠仍不拥挤 */
  .comment{gap:10px;padding:12px 0}
  .comment .avatar{width:36px;height:36px;font-size:14px}
  .c-name{font-size:14.5px}
  .c-text{font-size:15px;line-height:1.72}
  .c-time{margin-left:0;font-size:12px}
  .c-act{padding:7px 9px;font-size:13px}
  .comments{margin-top:14px;padding-top:12px}
  /* 信箱：手机上收紧内边距与头像，保持条目清晰不拥挤 */
  .notif{gap:10px;padding:12px 10px}
  .notif .avatar{width:36px;height:36px;font-size:13px}
  .n-actor{font-size:14.5px}
  .n-text{font-size:14px}
  .n-snippet{font-size:13px}
  .ib-badge{min-width:16px;height:16px;line-height:16px;font-size:10.5px}
}
/* 超小屏（<=360px）进一步压缩 */
@media (max-width:360px){
  .top-inner{padding:8px 10px}
  .logo-text{font-size:15px}
  .logo-mark{width:22px;height:22px}
  .container{padding:12px 10px 48px}
  .card{padding:12px}
  .post-card{padding:0}
}

/* ---------------- v3.2：举报弹窗 / 公告条 / 信箱分类 / 举报入口 ---------------- */
/* 举报弹窗（复用后台表单视觉，作用域限定前台） */
.modal-mask{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:120;display:flex;align-items:center;justify-content:center;padding:18px}
.modal{background:#fff;border-radius:12px;width:100%;max-width:440px;box-shadow:0 18px 50px rgba(15,23,42,.28);animation:pop .16s ease}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.98)}}
.modal .m-h{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #eef1f6}
.modal .m-h h3{margin:0;font-size:15.5px}
.modal .m-x{border:none;background:none;font-size:19px;color:#8b94a9;cursor:pointer;line-height:1;padding:2px 6px;border-radius:6px}
.modal .m-x:hover{background:#f1f3f8;color:#1e2430}
.modal .m-b{padding:16px 18px}
.modal .m-f{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px;border-top:1px solid #eef1f6}
.modal .field{margin-bottom:12px}
.modal .field label{display:block;font-size:12.5px;color:#59637a;margin-bottom:5px;font-weight:600}
.modal .input,.modal .select,.modal textarea.input{width:100%;border:1px solid #e2e6ee;border-radius:8px;padding:8px 10px;font-size:13.5px;font-family:inherit;outline:none}
.modal .input:focus,.modal .select:focus{border-color:#3b6ef5;box-shadow:0 0 0 3px rgba(59,110,245,.12)}

/* 举报入口按钮：低调、悬停显现，避免干扰浏览 */
/* 首页帖子举报入口：放在卡片头部右上角，任何屏宽都恒可见（放底部栏会被 flex 溢出裁掉） */
.post-report{flex:none;align-self:flex-start;background:#f7f9fd;border:1px solid var(--line);color:#8a94a6;
  cursor:pointer;font-size:12px;padding:3px 10px;border-radius:999px;font-family:inherit;line-height:1.6}
.post-report:hover{color:#dc2626;background:#fdeaea;border-color:#f7c9c9}
.act-report{background:none;border:none;color:#a6aec0;cursor:pointer;font-size:12.5px;padding:2px 6px;border-radius:6px}
.act-report:hover{color:#dc2626;background:#fdeaea}
.c-report{background:none;border:none;color:#a6aec0;cursor:pointer;font-size:12.5px}
.c-report:hover{color:#dc2626}

/* 首页公告条 */
.ann-bar{display:flex;align-items:center;gap:10px;background:#eaf0fe;border:1px solid #d5e1fd;border-radius:10px;
  padding:10px 14px;margin-bottom:12px;cursor:pointer;font-size:13.5px}
.ann-bar:hover{background:#e0e9fd}
.ann-bar.warn{background:#fdf2e3;border-color:#f6dfb8}
.ann-bar.danger{background:#fdeaea;border-color:#f7c9c9}
.ann-bar .ann-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ann-bar .ann-more{color:#3b6ef5;font-size:12.5px;white-space:nowrap}

/* 信箱分类页签容器与系统类通知 */
#ibTabs{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
#ibTabs .ib-filters{margin-left:auto;display:flex;gap:4px}
.notif-list{display:block}
.notif-sys{background:#fffaf5}
.notif-sys .n-type{color:#d97706}

/* 限制横幅/置灰/发件箱条目等基础样式已统一收敛到 /assets/theme.css */


/* ================= 页脚（v5.3 重做） =================
 * 结构：品牌区（图标+站名+标语） / 导航入口（法律声明·隐私说明·联系站长） / 版权
 * 设计约束：
 *   1) 与站点同语言 —— 品牌蓝、8px 圆角、浅边框、hover 用 brand-soft，不引入新风格；
 *   2) 桌面端三段左对齐排列（与页头左对齐呼应），移动端纵向堆叠并居中；
 *   3) sticky footer —— body 用弹性列布局 + main 撑开，内容不足一屏时
 *      页脚也不会「悬在半空」（这正是旧版的问题）。
 */
body{
  min-height:100vh;
  display:flex;flex-direction:column;
}
body > .container{flex:1 0 auto}

.site-foot{
  flex:none;
  margin-top:auto;                 /* 与 body 弹性列配合，保证贴底 */
  border-top:1px solid var(--line);
  background:#fff;
}
.site-foot-inner{
  max-width:860px;margin:0 auto;
  padding:20px 18px 22px;
  display:flex;align-items:center;gap:18px 28px;flex-wrap:wrap;
  font-size:12.5px;color:var(--sub);line-height:1.8;
}

/* 品牌区 */
.foot-brand{display:flex;align-items:center;gap:10px;min-width:0}
.foot-name{display:inline-flex;align-items:center;gap:7px;font-weight:700;color:var(--ink);font-size:13.5px;white-space:nowrap}
.foot-mark{width:20px;height:20px;border-radius:6px;flex:none;box-shadow:0 1px 2px rgba(20,30,60,.14)}
.foot-tagline{
  color:var(--sub);font-size:12.5px;white-space:nowrap;
  padding-left:10px;border-left:1px solid var(--line);
}

/* 导航入口：与页头 nav 同一交互语言（圆角胶囊 + 浅色 hover） */
.foot-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
.foot-links a{
  display:inline-flex;align-items:center;height:26px;padding:0 12px;border-radius:999px;
  font-size:12.5px;font-weight:600;color:var(--ink2);
  transition:background .15s,color .15s;white-space:nowrap;
}
.foot-links a:hover{background:var(--brand-soft);color:var(--brand)}
.foot-links a:focus-visible{outline:none;box-shadow:var(--focus,0 0 0 3px rgba(59,110,245,.16))}

/* 版权信息 */
.foot-copy{width:100%;color:var(--ink3);font-size:12px;padding-top:12px;border-top:1px solid var(--line2)}

/* 桌面端窄屏：导航换到下一行，避免与品牌区挤在一起 */
@media(max-width:720px){
  .foot-links{margin-left:0;width:100%;order:3}
}
@media(max-width:600px){
  .site-foot-inner{padding:16px 14px 18px;gap:12px;flex-direction:column;align-items:flex-start;text-align:left}
  .foot-brand{flex-direction:column;align-items:flex-start;gap:6px}
  .foot-tagline{padding-left:0;border-left:none}
  .foot-links{gap:6px}
  .foot-links a{height:28px;padding:0 14px;font-size:13px}   /* 移动端加大点击区域 */
  .foot-copy{font-size:11.5px;padding-top:10px}
}

/* ================= 信息页（法律声明 / 隐私说明 / 联系站长） ================= */
/* 与既有卡片语言一致：白底、浅边框、小圆角；标题层级靠字号与字重而非重色 */
.info-sec{margin-top:16px}
.info-sec:first-of-type{margin-top:0}
.info-h{
  font-size:14px;font-weight:700;color:var(--ink);margin:0 0 8px;
  padding-left:10px;border-left:3px solid var(--brand);   /* 品牌色竖条呼应页头强调 */
}
.info-list{margin:0;padding-left:20px;color:#39424f;font-size:13.5px;line-height:1.95}
.info-list li{margin-bottom:4px}
.info-list a{color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.info-foot{
  margin-top:18px;padding-top:12px;border-top:1px solid var(--line2);
  font-size:12.5px;color:var(--sub);
}
.info-foot a{color:var(--brand);font-weight:600}

/* 联系站长：邮箱卡片 */
.contact-box{
  background:var(--brand-soft);border:1px solid #d5e1fd;border-radius:12px;
  padding:18px;text-align:center;margin-bottom:4px;
}
.contact-label{font-size:12.5px;color:var(--ink2);font-weight:600;margin-bottom:6px}
.contact-mail{
  display:inline-block;font-size:19px;font-weight:700;color:var(--brand);
  letter-spacing:.3px;word-break:break-all;   /* 窄屏下邮箱不撑破布局 */
  text-decoration:none;transition:color .15s;
}
.contact-mail:hover{color:var(--brand-d);text-decoration:underline;text-underline-offset:3px}
.contact-actions{margin-top:14px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.contact-actions .btn{padding:8px 18px}

@media(max-width:600px){
  .info-list{font-size:13px;line-height:1.85;padding-left:18px}
  .info-h{font-size:13.5px}
  .contact-box{padding:15px 12px}
  .contact-mail{font-size:16px}          /* 手机上字号收一点，避免撑破 */
  .contact-actions .btn{flex:1 1 auto;min-width:120px}
}

/* ================= 横向溢出兜底（v5.3） =================
 * 信息页含长中文句子与邮箱地址，窄屏下容易把视口撑宽导致整体横向滚动。
 * 这里做三件事：
 *   1) 允许长串（邮箱、无空格文本）在容器内断行，不撑破卡片；
 *   2) 媒体元素与表格不再超出容器；
 *   3) 兜底禁止横向滚动（仅在确实溢出时生效，不影响正常布局）。
 */
.container,.card,.info-sec,.info-list,.contact-box,.site-foot-inner{
  min-width:0;max-width:100%;
}
.info-list li,.info-h,.foot-copy,.foot-tagline{
  overflow-wrap:anywhere;word-break:break-word;   /* 长串强制断行 */
}
.contact-mail{max-width:100%}
img,video,table,pre{max-width:100%}
img,video{height:auto}
@media(max-width:600px){
  .site-foot-inner{overflow-wrap:anywhere}
  .foot-copy{word-break:break-all}   /* 版权行在极窄屏也可断行 */
}

/* body 改为弹性列布局后，main 作为 flex item 默认 width:auto（由内容决定），
 * 会导致卡片在窄屏下按内容宽度渲染、右侧溢出视口。显式撑满即可修复。 */
body > .container{width:100%}
body > .site-foot{width:100%}

/* =============================================================================
 * 提交按钮三态反馈（发送中 / 成功 / 失败）
 *
 * 与 submit-state.js 的状态机一一对应：
 *   .is-loading 发送中 —— 禁用按钮 + 转圈图标 + 降低不透明度
 *   .is-sent    已成功 —— 成功色，短暂停留后由业务逻辑切走页面
 *   .is-error   失败   —— 警示色，按钮恢复可点，文案为「重试…」
 *
 * 无障碍：prefers-reduced-motion 下关闭旋转动画，仅保留颜色与文案区分。
 * ========================================================================== */
.btn.is-loading{
  position:relative;
  color:transparent!important;      /* 隐藏文字，改用伪元素转圈图标 */
  pointer-events:none;
  opacity:.75;
}
.btn.is-loading::after{
  content:"";position:absolute;top:50%;left:50%;
  width:15px;height:15px;margin:-8px 0 0 -8px;
  border:2px solid currentColor;border-radius:50%;
  border-top-color:transparent;
  animation:btnSpin .7s linear infinite;
}
@keyframes btnSpin{to{transform:rotate(360deg)}}

.btn.is-sent{
  background:var(--ok,#16a34a)!important;
  border-color:var(--ok,#16a34a)!important;
  color:#fff!important;
}
.btn.is-error{
  background:var(--bad,#dc2626)!important;
  border-color:var(--bad,#dc2626)!important;
  color:#fff!important;
}
/* 失败态按钮轻微脉冲，提示「可点击重试」，但不做持续闪烁以免刺眼 */
.btn.is-error:not(:disabled){animation:btnNudge 1.4s ease-in-out 2}
@keyframes btnNudge{0%,100%{transform:none}50%{transform:translateY(-1px)}}

@media(prefers-reduced-motion:reduce){
  .btn.is-loading::after{animation:none;border-top-color:currentColor;opacity:.6}
  .btn.is-error:not(:disabled){animation:none}
}

/* 举报弹窗内的状态提示条（提交中 / 失败原因） */
.rp-status{
  padding:9px 14px;font-size:12.5px;line-height:1.6;
  border-top:1px solid var(--line,#e5e7eb);
  background:var(--soft,#f8fafc);
  color:var(--muted,#64748b);
}
.rp-status.warn{background:#fffbeb;color:#b45309}
.rp-status.err{background:#fef2f2;color:#b91c1c}
