/* Dream 蓝色主题：参考 eshushu，蓝色渐变背景 + 白字 + 窄栏居中 */
:root {
  --blue: #1aa8fc;
  --blue-deep: #0a84f0;
  --blue-soft: #4dbdff;
  --accent: #d944fe;
  --ink: #fff;
  --ink-soft: rgba(255, 255, 255, 0.82);
  --ink-mute: rgba(255, 255, 255, 0.62);
  --line: rgba(255, 255, 255, 0.28);
  --panel: rgba(255, 255, 255, 0.1);
  --panel-hover: rgba(255, 255, 255, 0.16);
  --field-ink: #333;
  --radius: 10px;
  --wrap: 960px;
}

* { box-sizing: border-box; }
::-webkit-scrollbar { width: 10px; height: 10px; background-color: var(--blue-deep); }
::-webkit-scrollbar-thumb { border-radius: 8px; background-color: var(--blue-soft); }

html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  overflow-x: hidden;
  min-height: 100vh;
  font-size: 16px;
  font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background-color: var(--blue-deep);
  background-image: url(../pic/bg.png);
  background-repeat: round;
}
a { color: var(--ink); text-decoration: none; }
a:hover { color: var(--ink); text-decoration: underline; }

.text-center { text-align: center; }
.text-lg { font-size: 1.125rem; }
.py-16 { padding-top: 4rem !important; padding-bottom: 4rem !important; }
.w-full { width: 100%; }

.header-inner, .footer-inner, .main-wrap {
  width: min(var(--wrap), calc(100% - 1.5rem));
  margin: 0 auto;
}

/* 顶部：logo + 白色文字导航 */
.site-header { padding: 12px 0 6px; }
.header-inner {
  display: flex; align-items: center; justify-content: space-around; gap: 1.5rem;
}
.logo { display: inline-flex; align-items: center; transition: transform .3s ease; }
.logo:hover { transform: scale(1.04); text-decoration: none; }
.logo-img { display: block; width: 180px; height: 45px; object-fit: contain; border-radius: 6px; }
.nav-main { display: flex; align-items: center; gap: 2rem; }
.nav-main a {
  padding: 6px 2px;
  font-size: 1.05rem; letter-spacing: 2px; color: var(--ink);
  border-bottom: 2px solid transparent;
  transition: border-color .3s ease, color .3s ease;
}
.nav-main a:hover, .nav-main a.active { text-decoration: none; border-bottom-color: var(--ink); }

.hero-gap { padding: 1rem 0 1.5rem; }

/* 首页：顶部介绍 + 身份选择，两块独立的毛玻璃卡片 */
.home-intro, .home-user {
  margin: 0.5rem 0 1rem;
  background: var(--panel);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 14px;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.home-intro { padding: 1.6rem clamp(1rem, 4vw, 2.5rem) 1.5rem; text-align: center; }
.home-intro-title { margin: 0 0 0.6rem; font-size: clamp(1.25rem, 3vw, 1.6rem); font-weight: 600; letter-spacing: 4px; }
.home-intro-sub { margin: 0 0 1rem; color: var(--ink-soft); letter-spacing: 1px; }
.home-intro-text {
  margin: 0; padding-top: 1rem; border-top: 1px solid var(--line);
  text-align: left; text-indent: 2em; line-height: 1.95; letter-spacing: 1px; color: var(--ink-soft);
}
.list-intro { margin: 1.75rem 0 0.5rem; }
.home-user {
  display: flex; flex-direction: column; align-items: center; gap: 1.25rem;
  padding: 1.6rem 1rem 1.7rem; margin-bottom: 1.75rem;
}
.home-user-faces { display: flex; justify-content: center; gap: clamp(2rem, 8vw, 4rem); }
.home-user-face {
  display: flex; flex-direction: column; align-items: center; gap: 0.75rem;
  padding: 0; border: 0; background: none; color: var(--ink-soft);
  font: inherit; letter-spacing: 1px; cursor: pointer;
}
.home-user-face img {
  display: block; width: 92px; height: 92px; border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, 0.35);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.home-user-face:hover img { transform: translateY(-2px); border-color: rgba(255, 255, 255, 0.7); }
.home-user-face.on { color: var(--ink); font-weight: 600; }
.home-user-face.on img { border-color: #fff; box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.18); }
.btn-primary.home-user-start {
  width: 260px; max-width: 100%; min-width: 0; padding: 12px 26px;
  border: 2px solid #eee; color: #eee; letter-spacing: 3px;
  transition: border-color .2s ease, color .2s ease;
}
.btn-primary.home-user-start:hover { background: transparent; box-shadow: none; border-color: #ff3395; color: #ff3395; text-decoration: none; }

/* 首页：官网介绍 */
.site-about-body {
  padding: 1.1rem clamp(1rem, 3vw, 1.6rem) 1.2rem;
  background: var(--panel);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--radius);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.site-about-body p {
  margin: 0 0 0.6rem; text-indent: 2em;
  color: var(--ink-soft); line-height: 1.95; letter-spacing: 1px;
}
.site-about-body p:last-child { margin-bottom: 0; }

/* App 下载：使用帮助 */
.app-help { text-align: center; }
.site-about-body.app-help p { text-indent: 0; }
.app-help-qr {
  display: block; width: 180px; max-width: 60%; height: auto;
  margin: 0.4rem auto 1rem; padding: 8px;
  background: #fff; border-radius: var(--radius);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}
.app-help-link {
  display: inline-block; margin: 0 0 1rem; padding: 0.35rem 1rem;
  max-width: 100%; word-break: break-all;
  color: var(--ink); letter-spacing: 0.5px;
  border: 1px dashed rgba(255, 255, 255, 0.45); border-radius: 999px;
}
a.app-help-link:hover { background: rgba(255, 255, 255, 0.12); text-decoration: underline; text-underline-offset: 4px; }
.site-about-body.app-help .app-help-foot {
  margin-top: 0.4rem; padding-top: 1rem; border-top: 1px solid var(--line);
}

/* 开始聊天：桌面弹二维码，微信/QQ 内提示右上角用浏览器打开 */
.app-pop-mask, .app-pop, .app-prompt {
  opacity: 0; visibility: hidden;
  transition: opacity .4s ease, visibility .4s ease;
}
.app-pop-mask.show, .app-pop.show, .app-prompt.show { opacity: 1; visibility: visible; }
.app-pop-mask { position: fixed; inset: 0; z-index: 1001; background: rgba(0, 20, 50, 0.6); }
.app-pop {
  position: fixed; top: 50%; left: 50%; z-index: 1002;
  transform: translate(-50%, -50%);
  width: min(360px, 88vw); padding: 22px 22px 18px;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  background: #fff; border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0, 40, 90, 0.35);
}
.app-pop img { display: block; width: 100%; max-width: 280px; height: auto; cursor: pointer; }
.app-pop span { color: var(--blue-deep); font-size: 1.05rem; letter-spacing: 1px; line-height: 1.6; text-align: center; }
.app-prompt { position: fixed; inset: 0; z-index: 999; background: rgba(0, 0, 0, 0.5); }
.app-prompt img { position: absolute; right: 1.1rem; top: -0.3rem; max-width: 80vw; height: auto; }

/* 区块标题：左侧白色竖条 */
.section-title { margin: 0 0 1rem; font-size: 1.2rem; font-weight: 600; letter-spacing: 4px; color: var(--ink); }
.cat-block { margin-bottom: 1.75rem; }
.feed-home-head, .detail-more-head {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  margin: 1.5rem 0 1rem;
}
.feed-home-title-wrap { display: flex; align-items: center; gap: 0.6rem; min-width: 0; }
.feed-home-mark, .detail-more-mark {
  width: 5px; height: 1.1rem; flex-shrink: 0; background: var(--ink);
}
.feed-home-mark-soft, .detail-more-mark-soft { background: var(--ink-soft); }
.feed-home-title, .detail-more-title { margin: 0; font-size: 1.1rem; letter-spacing: 3px; }
.more-link { color: var(--ink); font-size: 0.95rem; letter-spacing: 1px; }
.search-count { color: var(--ink-soft); font-size: 0.95rem; }
.search-count strong, .search-kw { color: var(--ink); font-weight: 700; }

/* 信息流：透明卡片 + 分隔线 */
/* 半透明毛玻璃卡片（Glassmorphism） */
.feed-card {
  margin-bottom: 0.75rem;
  padding: 0.9rem 0.9rem 1rem;
  background: var(--panel);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--radius);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  transition: background-color .2s ease, border-color .2s ease;
}
.feed-card:last-child { margin-bottom: 0; }
.feed-card:hover { background: var(--panel-hover); border-color: rgba(255, 255, 255, 0.28); }
.feed-card-top { background: rgba(255, 255, 255, 0.16); border-color: rgba(255, 255, 255, 0.32); }
.feed-card-top:hover { background: rgba(255, 255, 255, 0.22); }
.feed-head { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 0.45rem; }
.cat-pill {
  display: inline-flex; align-items: center;
  padding: 2px 10px; border-radius: 30px;
  font-size: 0.85rem; letter-spacing: 1px; color: var(--ink);
  border: 1px solid var(--ink-soft);
}
.cat-pill-top { background: #fff; border-color: #fff; color: var(--blue-deep); font-weight: 600; }
.feed-title {
  display: block; margin: 0 0 0.45rem;
  font-size: 1.12rem; font-weight: 600; letter-spacing: 1px; line-height: 1.6; color: var(--ink);
}
.feed-body {
  color: var(--ink-soft); font-size: 1rem; letter-spacing: 1px; line-height: 1.85; word-break: break-word;
}
.feed-body .more { margin-left: 0.4rem; color: var(--ink); white-space: nowrap; }
.feed-empty, .relate-empty, .comment-empty {
  margin: 0.5rem 0; padding: 1rem; text-align: center;
  color: var(--ink-soft); border: 1px dashed var(--line); border-radius: var(--radius);
}

.feed-pics { display: flex; flex-wrap: wrap; margin: 0.75rem -5px 0.25rem; }
.feed-pics .img { position: relative; width: 25%; padding: 0 5px; margin-bottom: 10px; }
.feed-pics img {
  display: block; width: 100%; height: 220px; object-fit: cover;
  border-radius: 8px; cursor: pointer; background: var(--panel);
  transition: transform .3s ease;
}
.feed-pics img:hover { transform: scale(1.03); }
.pic-count {
  position: absolute; right: 12px; bottom: 8px; z-index: 2;
  padding: 2px 8px; border-radius: 30px;
  background: rgba(0, 40, 90, 0.65); color: #fff; font-size: 0.78rem; pointer-events: none;
}
@media (max-width: 991px) {
  .feed-pics .img { width: 33.333%; }
  .feed-pics img { height: 180px; }
}
@media (max-width: 767px) {
  .feed-pics .img { width: 50%; }
  .feed-pics img { height: 150px; }
}

.feed-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.6rem; }
.tag {
  display: inline-block; padding: 1px 10px; border-radius: 30px;
  font-size: 0.85rem; color: var(--ink-soft); background: var(--panel);
}
a.tag:hover { color: var(--ink); background: var(--panel-hover); text-decoration: none; }
.feed-manage { margin-left: auto; display: flex; gap: 1rem; align-items: center; }
.feed-manage .feed-time { color: var(--ink-mute); font-size: 0.88rem; }

/* 面包屑 / 类别导航 */
.breadcrumb {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem;
  margin: 0.5rem 0 1rem; padding-left: 0.6rem;
  border-left: 5px solid var(--ink);
  font-size: 1.05rem; line-height: 1.4;
}
.breadcrumb .crumb, .breadcrumb .current { color: var(--ink-soft); }
.breadcrumb .crumb-current, .breadcrumb .current {
  color: var(--ink);
  max-width: min(100%, 28rem); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.breadcrumb .sep { color: var(--ink-mute); }
.type-nav { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0 0 1.25rem; }
.type-nav a {
  padding: 5px 16px; border-radius: 30px;
  border: 1px solid var(--ink-soft); color: var(--ink); font-size: 0.95rem; letter-spacing: 1px;
  transition: background .2s ease, color .2s ease;
}
.type-nav a:hover { background: var(--panel-hover); text-decoration: none; }
.type-nav a.on { background: #fff; color: var(--blue-deep); border-color: #fff; font-weight: 600; }

/* 分页 */
.page-pagen {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; row-gap: 6px;
  margin: 20px 0 30px; text-align: center; line-height: 32px;
}
.page-pagen a { display: inline-block; vertical-align: middle; color: var(--ink); }
.page-pagen a.page-num {
  width: 32px; height: 32px; margin: 0 4px; line-height: 32px; border-radius: 50%; text-align: center;
}
.page-pagen a.page-num:hover { background: var(--panel-hover); text-decoration: none; }
.page-pagen a.page-num.on { background: #fff; color: var(--blue-deep); font-weight: 700; }
.page-pagen > span { display: inline-block; vertical-align: middle; }
.page-pagen > span a.page-nav { padding: 0 10px; }
.page-pagen em { display: inline-block; margin: 0 4px; font-style: normal; font-weight: 700; vertical-align: middle; }
.page-pagen .page_info { margin-left: 16px; color: var(--ink-soft); vertical-align: middle; }
.page-pagen .page_info .page_num { color: var(--ink); margin: 0 3px; font-weight: 700; }

/* 详情 / 关于 */
.detail-card { margin: 0 0 1.5rem; }
.detail-head { margin: 0 0 1rem; padding: 0 0 0.9rem; border-bottom: 1px solid var(--line); }
.detail-title { margin: 0 0 0.5rem; font-size: clamp(1.35rem, 3vw, 1.75rem); line-height: 1.45; letter-spacing: 2px; color: var(--ink); }
.detail-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin: 0; color: var(--ink-mute); font-size: 0.9rem; }
.detail-meta-cat { color: var(--ink-soft); }
.detail-meta-dot { opacity: 0.6; }
.detail-panel { margin-top: 0.75rem; }
.detail-content {
  margin: 0; color: var(--ink);
  font-size: 1.05rem; letter-spacing: 1.5px; line-height: 2;
  white-space: pre-wrap; word-break: break-word;
  text-indent: 2em each-line;
}
.detail-content:has(p) { white-space: normal; text-indent: 0; }
.detail-content p { margin: 0 0 0.9em; text-indent: 2em; white-space: normal; }
.detail-content p:last-child { margin-bottom: 0; }
.detail-content h1, .detail-content h2, .detail-content h3,
.detail-content h4, .detail-content h5, .detail-content h6,
.detail-content img, .detail-content table, .detail-content pre,
.detail-content ul, .detail-content ol, .detail-content blockquote { text-indent: 0; }
.detail-content a { text-decoration: underline; }
.detail-content img { display: block; max-width: 100%; height: auto; }
.detail-content video { display: block; max-width: 100%; height: auto; }
.detail-content iframe { max-width: 100%; }
.detail-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.detail-content pre { max-width: 100%; overflow-x: auto; white-space: pre; }
.detail-video { display: flex; justify-content: center; margin: 1.15rem 0 0; }
.detail-video video {
  display: block; width: min(100%, 960px); height: 540px; max-width: 100%;
  background: #000; object-fit: contain; border-radius: 10px;
}
.article-photos { display: flex; flex-direction: column; gap: 0.9rem; margin: 1.1rem 0 0; }
.article-photos figure { margin: 0; }
.article-photos img {
  display: block; max-width: 100%; height: auto; margin: 0 auto;
  border-radius: 8px; cursor: zoom-in;
}
.detail-tags { margin-top: 1rem; padding-top: 0.8rem; border-top: 1px solid var(--line); }

.article-photo-lightbox {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  padding: 0.6rem; background: rgba(0, 20, 50, 0.85); cursor: zoom-out;
}
.article-photo-lightbox .imgArea {
  position: relative; z-index: 1; width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
}
.article-photo-lightbox .article-photo-lightbox-img {
  display: block; max-width: min(92%, 100vw); max-height: min(92%, 100dvh);
  object-fit: contain; border-radius: 8px; cursor: default;
}
.article-photo-lightbox a.article-photo-arrow {
  position: absolute; z-index: 2; width: 2.1cm; height: 2.1cm; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; color: #fff;
}
.article-photo-lightbox a.article-photo-arrow svg { width: 1.15cm; height: 1.15cm; }
.article-photo-lightbox a.article-photo-arrow path {
  fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round;
}
.article-photo-lightbox a.article-photo-arrow:hover { background: rgba(26, 168, 252, 0.6); }
.article-photo-lightbox a.article-photo-arrow.left { left: 8%; }
.article-photo-lightbox a.article-photo-arrow.right { right: 8%; }

/* 详情页：最新发布 / 相关推荐 */
.detail-more { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.detail-more-panel { margin-bottom: 0; min-width: 0; }
.detail-more-head { justify-content: flex-start; gap: 0.6rem; }
.relate-list { list-style: none; margin: 0; padding: 0; }
.relate-item {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.55rem 0.25rem; border-bottom: 1px solid var(--line); color: var(--ink);
}
.relate-item:hover { text-decoration: none; background: var(--panel); }
.relate-index {
  flex-shrink: 0; width: 1.5rem; height: 1.5rem; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.8rem; font-weight: 700; background: var(--panel-hover);
}
.relate-list li:nth-child(-n+3) .relate-index { background: #fff; color: var(--blue-deep); }
.relate-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.15rem; }
.relate-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: 1px; }
.relate-meta { font-size: 0.8rem; color: var(--ink-mute); }
.relate-arrow { flex-shrink: 0; opacity: 0; transition: opacity .2s ease; }
.relate-item:hover .relate-arrow { opacity: 1; }
@media (max-width: 820px) {
  .detail-more { grid-template-columns: 1fr; gap: 0.5rem; }
}

/* 友情链接 */
.friend-links { display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; align-items: center; line-height: 1.8; }
.friend-links a { color: var(--ink); letter-spacing: 1px; }

/* 底部 */
.site-footer { margin-top: 1.5rem; padding: 1rem 0 3rem; }
.footer-inner { border-top: 1px solid var(--line); padding-top: 1rem; text-align: center; }
.footer-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem 1.2rem; margin: 0 0 0.6rem; }
.footer-nav a { color: var(--ink); }
.copyright {
  display: flex; flex-direction: column; align-items: center; gap: 0.3rem;
  margin: 0; color: var(--ink-soft); font-size: 0.9rem; line-height: 1.9;
}
.copyright-brand { color: var(--ink); }
.copyright-meta { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.2rem 1.2rem; }
.copyright a { color: var(--ink-soft); }
.copyright a:hover { color: var(--ink); }

/* 表单 */
.form-card {
  margin: 0.5rem auto 0; padding: 2rem clamp(1.1rem, 4vw, 3rem) 2.2rem;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
}
.form-card .section-title { font-size: 1.35rem; margin-bottom: 1.5rem; }
.form-row { margin-bottom: 1.15rem; }
.form-row label { display: block; margin-bottom: 0.45rem; letter-spacing: 1px; color: var(--ink); }
.form-row input[type=text], .form-row input[type=password], .form-row textarea, .form-row select {
  width: 100%; padding: 0.75rem 0.95rem;
  border: 2px solid transparent; border-radius: 8px;
  background: #fff; color: var(--field-ink); font: inherit; outline: none;
  transition: border-color .2s ease;
}
.form-row input:focus, .form-row textarea:focus, .form-row select:focus { border-color: var(--accent); }
label:has(#linkedUs), .form-check {
  display: inline-flex !important; align-items: center; gap: 0.5rem;
  margin-bottom: 0 !important; cursor: pointer; user-select: none;
}
.form-check input[type=checkbox], .comment-anon input[type=checkbox] {
  -webkit-appearance: none; appearance: none;
  flex: 0 0 20px; width: 20px; height: 20px; margin: 0;
  border: 2px solid rgba(255, 255, 255, 0.85); border-radius: 6px;
  background: rgba(255, 255, 255, 0.12) center / 14px 14px no-repeat;
  cursor: pointer; transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.form-check:hover input[type=checkbox], .comment-anon:hover input[type=checkbox] {
  border-color: #fff; background-color: rgba(255, 255, 255, 0.22);
}
.form-check input[type=checkbox]:checked, .comment-anon input[type=checkbox]:checked {
  border-color: #fff; background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='%230a84f0' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.form-check input[type=checkbox]:focus-visible, .comment-anon input[type=checkbox]:focus-visible {
  outline: none; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35);
}
.btn-primary {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 26px; min-width: 10rem;
  border: 2px solid #fff; border-radius: 30px; background: transparent;
  color: #fff; font: inherit; font-size: 1rem; letter-spacing: 3px; cursor: pointer;
  transition: background .2s ease, box-shadow .2s ease;
}
.btn-primary:hover {
  background: rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.45);
  text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px;
}
.form-card .btn-primary { margin-top: 0.4rem; padding: 12px 26px; }
.captcha-row { display: flex; gap: 0.75rem; align-items: center; }
.captcha-row img { height: 44px; border-radius: 8px; cursor: pointer; background: #fff; }

/* 评论 */
.comment-form {
  margin: 0 0 1.25rem; padding: 1.1rem 1.1rem 1.2rem;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
}
.comment-user-fields { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.comment-user-fields input[type=text] { flex: none; width: 40%; min-width: 9rem; max-width: 16rem; }
.comment-user-fields input[type=text][readonly] { color: #888; background: #eef6ff; cursor: pointer; }
.comment-anon { display: inline-flex !important; align-items: center; gap: 0.5rem; margin: 0 !important; white-space: nowrap; cursor: pointer; user-select: none; }
.comment-form .captcha-row input[type=text] { flex: 1; min-width: 0; max-width: 12rem; }
.comment-submit { display: flex; justify-content: center; margin-top: 0.4rem; }
.comment-submit .btn-primary { width: 100%; padding: 12px 26px; }
.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-item { padding: 0.8rem 0.25rem; border-bottom: 1px solid var(--line); }
.comment-item:last-child { border-bottom: 0; }
.comment-item-head { display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.35rem; }
.comment-name { font-weight: 600; color: var(--ink); }
.comment-time { color: var(--ink-mute); font-size: 0.85rem; white-space: nowrap; }
.comment-body { margin: 0; color: var(--ink-soft); line-height: 1.8; letter-spacing: 1px; word-break: break-word; white-space: pre-wrap; }

/* dream.js 弹框 */
.bg1, .bg2 { position: fixed; inset: 0; z-index: 9999; display: flex; justify-content: center; align-items: center; }
.bg1 > .mask, .bg2 > .mask { position: absolute; inset: 0; background: #000; opacity: .45; z-index: 0; }
.confirm {
  position: relative; z-index: 1; min-width: min(8cm, 92vw); max-width: min(10cm, 92vw);
  border: 1.5px solid var(--blue); border-radius: 10px; overflow: hidden; background: #fff;
  box-shadow: 0 18px 50px rgba(26, 168, 252, .3);
}
.confirm_title {
  margin: 0; padding: 10px 14px; background: var(--blue); color: #fff; font-size: 15px;
  display: flex; justify-content: space-between; align-items: center;
}
.confirm_title > a { color: #fff; font-size: 13.5px; font-weight: 700; line-height: 1; }
.confirm_title > a:hover { text-decoration: none; font-size: 15px; }
.confirm_content { padding: 22px 30px; text-align: center; font-size: 15px; color: #333; word-break: break-all; line-height: 1.7; }
.confirm_buttons { display: flex; justify-content: space-evenly; align-items: center; padding: 0 12px 18px; }
.confirm_buttons > a {
  padding: 6px 24px; color: var(--blue); background: #fff;
  border: 1.35px solid var(--blue); border-radius: 8px; font-size: 15px; cursor: pointer;
}
.confirm_buttons > a.hover, .confirm_buttons > a:hover { background: var(--blue); color: #fff; text-decoration: none; }
.bg2 { align-items: flex-start; }
.bg2 > .alert1 { position: relative; z-index: 1; margin-top: 38vh; display: flex; flex-direction: column; align-items: center; max-width: min(520px, 90vw); }
.bg2 > .alert1 > .info1 {
  background: var(--blue); color: #fff; padding: 8px 14px; border-radius: 6px; margin-bottom: 6px;
  box-shadow: 0 0 20px var(--blue-soft); font-size: 15px; line-height: 1.55;
}
.bg2 > .alert1 > .secs { font-size: 14px; color: #fff; text-shadow: 0 1px 4px rgba(0, 0, 0, .45); }

@media (max-width: 720px) {
  .header-inner { flex-direction: column; gap: 0.5rem; }
  .logo-img { width: 160px; height: 40px; }
  .nav-main { gap: 1.4rem; }
  .nav-main a { font-size: 1rem; letter-spacing: 1px; }
  .hero-gap { padding: 0.5rem 0 1rem; }
  .form-card { padding: 1.4rem 1.1rem 1.6rem; }
  .captcha-row img { height: 40px; }

  .home-intro-title { letter-spacing: 2px; }
  .section-title, .feed-home-title, .detail-more-title { letter-spacing: 2px; }
  .home-intro-text, .site-about-body p, .feed-body, .detail-content, .comment-body { letter-spacing: 0.5px; }
  .home-intro-text, .site-about-body p { line-height: 1.85; }
  .home-user-face img { width: 76px; height: 76px; }

  .feed-home-head { flex-wrap: wrap; gap: 0.5rem; margin: 1.1rem 0 0.8rem; }
  .feed-card { padding: 0.8rem 0.8rem 0.9rem; }
  .feed-title { font-size: 1.05rem; }
  .breadcrumb { font-size: 1rem; }
  .detail-video video { height: auto; aspect-ratio: 16 / 9; }
  .type-nav a { padding: 4px 12px; font-size: 0.9rem; }

  .page-pagen a.page-num { margin: 0 2px; }
  .page-pagen > span a.page-nav { padding: 0 6px; }
  .page-pagen .page_info { flex-basis: 100%; margin-left: 0; }

  .comment-form { padding: 0.9rem 0.85rem 1rem; }
  .comment-user-fields input[type=text] { flex: 1; width: auto; max-width: none; }
  .comment-item-head { flex-wrap: wrap; }

  .article-photo-lightbox a.article-photo-arrow { width: 44px; height: 44px; background: rgba(0, 20, 50, 0.35); }
  .article-photo-lightbox a.article-photo-arrow svg { width: 26px; height: 26px; }
  .article-photo-lightbox a.article-photo-arrow.left { left: 2%; }
  .article-photo-lightbox a.article-photo-arrow.right { right: 2%; }
}
@media (max-width: 480px) {
  .feed-pics { margin-left: -4px; margin-right: -4px; }
  .feed-pics .img { padding: 0 4px; margin-bottom: 8px; }
  .feed-pics img { height: 120px; }
  .pic-count { right: 8px; bottom: 6px; }
}