.page-wrap {
  max-width: 375px;      /* 统一为手机宽度 */
  width: 100%;           /* 自适应宽度，防止横向滚动 */
  margin: 0 auto;        /* 居中 */
  box-sizing: border-box;
}


/* 3. 顶部固定头栏：水平分布，居中对齐 */
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1em;
  border-bottom: 0px solid #ddd;
  font-size: 1em;
}

/* 4. 主内容区：设置上下边距和内边距，避免与头尾重叠 */
main {
  margin-top: 1em;
  margin-bottom: 4em;
  padding: 1em;
}

/* 5. 底部固定栏：水平居中，用于主要操作按钮 */
footer {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  display: flex; justify-content: center; align-items: center;
  gap: 1em;
  background: #f5f5f5; border-top: 1px solid #ddd;
  padding: 0.5em 0;
}

/* 6. 底部按钮样式：无外边距，由父容器 gap 控制 */
footer a {
  font-size: 1em;
  text-decoration: none;
  color: #333;
  margin: 0;  /* 由 gap 控制 */
}
footer a.large-btn {
  font-size: 1.4em;
  margin: 0 0.3em;
  font-weight: bold;
}

/* 7. iPhone 风格 Dock：固定底部，居中显示，半透明毛玻璃效果 */
.dock {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 100%;
  max-width: 375px;

  background: #be1a1a;
  border: 1px solid #ddd;
  border-radius: 18px 18px 0 0;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);

  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 1em;
  padding: 0.6em 0;
  font-size: 1em;

  backdrop-filter: blur(10px);
  background-color: rgba(190, 190, 190, 0.368);  /* 毛玻璃效果 */
}

/* 8. 全局背景和字体：设置背景图/颜色和无边距 */
body {
  font-family: sans-serif;
  background-color: var(--bg-color);
  background-image: var(--bg-img, url('/static/default.jpg'));
  background-repeat: no-repeat;
  background-position: var(--bg-position, center);
  background-size: cover;
  margin: 0;
  padding: 0 0 3.5em 0;
  color: var(--text-color, #ffffff);
}

/* 9. 主题变量：定义标题和链接颜色变量 */
:root {
  --title-color: #333;
  --link-color: #2f2f2f;
}



/* 10. 引导文本：大号居中文字，用于欢迎信息或 emoji */
.intro-text {
  margin-bottom: 1em;
  color: #444;
  text-align: center;
  font-size: 2em;         /* 控制 emoji 大小，可调整为 1.5em、3em 等 */
  line-height: 2em;       /* 设置行距，让 emoji 更独立 */
  text-align: center;     /* 居中显示 */
  margin-top: 1em;        /* 与上方项目列表拉开距离 */

}


/* 11. 搜索栏样式：固定顶部，毛玻璃背景，阴影分隔 */
.header-bar {
  position: sticky;
  top: 0.8em;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8em 1em;

  backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, 0.65); /* 毛玻璃效果 */

  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid #ddd;

  max-width: 340px;
  margin: 1em auto;
  border-radius: 10px;
}

/* 搜索栏样式：毛玻璃效果 */
.search-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.8em 1em;

  backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, 0.317); /* 毛玻璃效果 */

  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid #dddddd83;

  max-width: 375px;
  margin: 1em auto;
  border-radius: 12px;
}


/* 12. 内容容器：带毛玻璃或半透明背景，用于卡片之类的面板 */
.container {
  background: rgba(0, 238, 143, 0.8);
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 20px;
  margin-top: 20px;
}

/* 13. 提案卡片：响应式宽度，居中显示，阴影和边框效果 */

/* 14. 提案卡片悬停：放大阴影，突出显示 */
.post-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* 15. 工具栏容器：按钮群布局，紧凑间距和阴影效果 */
/* 16. 工具栏按钮：等宽分布，无边距，圆角和交互反馈 */
/* Shared button style for toolbar and action buttons */
.toolbar-btn,
.action-buttons .action-button {
  width: calc((100% - 4px)/3);
  margin: 0;
  padding: 0.6em;
  border: none;
  background: transparent;
  font-size: 0.95em;
  border-radius: 6px;
  color: #8a8a8a87;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* Hover state for toolbar and action buttons */
.toolbar-btn:hover,
.action-buttons .action-button:hover {
  background: #84848400;
}

/* Active state for toolbar and action buttons */
.toolbar-btn.active,
.action-buttons .action-button.active {
  font-weight: bold;
  font-size: 1.1em;
  color: #ffffff;
}
/* 卡片统一毛玻璃效果，提升视觉一致性 */
.post-card,
.proposal-card,
.toolbar-card,
.profile-card,
.info-card {
  display: block;
  max-width: 375px;
  margin: 0.5em auto 1em auto;
  /* 移除 padding，交由 .card-content 控制 */
  border-radius: 10px;
  background-color: rgba(22, 22, 22, 0.869);
  backdrop-filter: blur(12px);
  border: 1px solid #5858585f;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
  text-decoration: none;
  color: inherit;
  text-align: left;
  transition: box-shadow 0.2s ease;
}


/* 19. 标题与搜索框并排样式 */
.header-bar-title-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1em;
  padding: 0.5em 1em;
}

.header-bar-title-input h1 {
  font-size: 1.2em;
  margin: 0;
  color: white;
  white-space: nowrap;
}

.header-bar-title-input input {
  flex-grow: 1;
  max-width: 240px;
  padding: 0.4em 0.8em;
  border: 2px solid #888888;
  border-radius: 12px;
  font-size: 0.95em;
  font-weight: 500;
  outline: none;
  background: white;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}



/* 20. 按钮容器统一颜色控制 */
.action-buttons {
  display: flex;
  justify-content: space-around;
  padding: 0.6em 0;
  margin-top: 1em;
  border-radius: 10px;
  background-color: rgba(22, 22, 22, 0.869);
  backdrop-filter: blur(12px);
  border: 1px solid #5858585f;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}


.image-picker .slot,
.proof-gallery .slot {
  position: relative;
}

/* 提交图片的圆角矩形背景色 */
.image-picker .slot {
  background-color: var(--upload-slot-bg, rgba(255, 255, 255, 0.1)); /* 可自定义变量或写死颜色 */
  position: relative;
}

/* “添加”按钮（加号框）可单独设置不同颜色 */
.image-picker .slot.add {
  background-color: var(--add-slot-bg, rgba(255, 255, 255, 0.2));
}
.image-picker .slot img,
.proof-gallery .slot img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  margin: 0 auto; /* 居中展示 */
}

.image-picker .remove-btn {
  z-index: 2;
  position: absolute;
  top: 1px;
  right: 6px;
  width: 24px;
  height: 24px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  border: none;
  border-radius: 50%;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.card-img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  display: block;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.card-content {
  padding: 1em;
}

.card-img-wrap {

  aspect-ratio: 1 / 1;      /* 变为正方形 */
  border-radius: 18px;
  overflow: hidden;         /* 重点！保证内部内容被圆角裁切 */
  margin-bottom: 16px;
  position: relative;
  background: #222;         /* 可选：避免图片间露底色 */
  display: block;
}

.card-img-wrap .carousel {
  width: 100%;
  height: 100%;
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.card-img-wrap .slide {
  flex: none;

  scroll-snap-align: center;
  position: relative;
}

.card-img-wrap .slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0;        /* 确保图片本身无圆角，只由 .card-img-wrap 控制圆角 */
}

.project-title {
  color: white;
  text-decoration: none;
  white-space: nowrap;
}



/* 隐藏按钮样式：无背景，灰色文字，指定字号 */
.hidden-button {
  background-color: var(--hidden-color, transparent);
  color: var(--text-color, #333);
  font-size: 14px;
  display: inline-block;
  padding: 4px 12px;
  border-radius: var(--hidden-button-radius, 6px);
}

/* 强调按钮样式：主色背景，白色文字，指定字号 */
.emphasis-button {
  background-color: var(--accent-color, #00ab72);
  color: #ffffff;
  font-size: 16px;
  display: inline-block;
  padding: 8px 16px;
  border-radius: var(--emphasis-button-radius, 8px);
}

/* 分隔线（divider）样式 */
.divider {
  height: 1px;
  background-color: var(--line-color, #ccc);
  margin: 1em 0;
  border: none;
}

/* ================ 统一操作按钮 (main-btn) ================ */
.main-btn {
  display: inline-block;           /* 随内容宽度自适应 */
  padding: 12px 24px;              /* 上下内边距12px，左右24px */
  font-size: 1em;                  /* 默认字体大小 */
  border: none;                    /* 无边框 */
  border-radius: 8px;              /* 8px圆角 */
  cursor: pointer;                 /* 鼠标悬停指针 */
  background: var(--btn-bg, #5858585b); /* 背景色 */
  color: var(--btn-text, #ffffff);    /* 文字色 */
  transition: background 0.2s ease;    /* 背景过渡效果 */
}

.main-btn:hover {
  background: var(--btn-hover-bg, #5c5c5cc7); /* 悬停背景色 */
}

.main-btn:focus,
.main-btn:active {
  outline: none;   /* 取消焦点轮廓 */
  box-shadow: none;/* 取消默认阴影 */
}


/* 强制将搜索栏设为红色背景和边框 */
#projectSearchInput,
input[type="search"]#projectSearchInput {
  background-color: rgba(255, 255, 255, 0) !important;
  border: 2px solid rgba(125, 125, 125, 0.509) !important;
  color: white !important;
}

.vote-bar {
  display: flex;
  width: 100%;
  height: 38px;
  border-radius: 12px;
  overflow: hidden;
  background: #bbb;
  box-shadow: 0 1px 2px rgba(0,0,0,0.06);
  margin-top: 1em;
  margin-bottom: 0.6em;
  font-size: 1.1em;
}
.vote-like, .vote-dislike {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  transition: width 0.3s;
  font-weight: 600;
}
.vote-like {
  background: #00ffe1e3;  /* 点赞绿色背景（动态） */
  color: #ffc824;
  justify-content: flex-start;
  min-width: 44px;
  padding-left: 0.5em;
  gap: 0.2em;
}
.vote-dislike {
  background: #999999;
  color: #ffc824;
  justify-content: flex-end;
  min-width: 44px;
  padding-right: 0.5em;
  gap: 0.2em;
}

/* Image grid layout for post_detail.html */
.image-grid {
  display: grid;
  gap: 4px;
  margin-bottom: 16px;
  border-radius: 10px;
  overflow: hidden;
}
.image-grid.grid-1 {
  grid-template-columns: 1fr;
}
.image-grid.grid-2 {
  grid-template-columns: repeat(2, 1fr);
}
.image-grid.grid-3 {
  grid-template-columns: repeat(3, 1fr);
}
.grid-item {
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
}
.grid-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
#token-stats {
  padding:12px 16px;
  background-color: rgba(22, 22, 22, 0.869);
  border-radius:8px;
  margin-bottom:12px;
  border: 1px solid #5858585f;
}
.stats-cards {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:12px;
}
.stat {
  flex:1 1 140px;
  padding:10px;
  background-color: rgba(60, 60, 60, 0.869);
  border-radius:6px;
  box-shadow:0 2px 4px rgba(0,0,0,0.1);
  text-align:center;
}
.stat .num {
  font-size:20px;
  font-weight:bold;
  color: #fff;
  display:block;
}
.stat .label {
  font-size:12px;
  color:#cccccc;
}


/* Updated rule for .vote-bar.disabled */
.vote-bar.disabled {
  pointer-events: none;
  height: 8px;
  opacity: 0.6;
}

/* Hide emoji and numbers but keep colored segments when disabled */
.vote-bar.disabled .vote-like span,
.vote-bar.disabled .vote-dislike span {
  display: none !important;
}
.vote-bar.disabled .vote-like,
.vote-bar.disabled .vote-dislike {
  font-size: 0 !important;
}


/* ===== 已完成卡片毛玻璃背景 ===== */
.post-card.completed {
  position: relative;
  overflow: hidden;
}
.post-card.completed::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('/static/beijing.png') center/cover no-repeat;
  filter: blur(6px);
  z-index: -1;          /* 背后 */
}

/* ===== 表单紧凑风格（仅作用于本页 tokenSettingsForm） ===== */
#tokenSettingsForm.form-compact .fields-grid { gap: .6em; }
#tokenSettingsForm.form-compact .field { margin-bottom: .6em; }
#tokenSettingsForm.form-compact .field label {
  color: rgba(255,255,255,0.85);
  font-weight: 600;
  margin-bottom: 6px;
}
#tokenSettingsForm.form-compact input[type="text"],
#tokenSettingsForm.form-compact input[type="number"],
#tokenSettingsForm.form-compact input[type="search"],
#tokenSettingsForm.form-compact input[type="email"],
#tokenSettingsForm.form-compact input[type="url"] {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.28);
  background: rgba(255,255,255,0.08);
  color: #fff;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
  box-sizing: border-box;
}
#tokenSettingsForm.form-compact input::placeholder { color: rgba(255,255,255,0.5); }
#tokenSettingsForm.form-compact input:focus {
  border-color: #00ffe1e3;
  box-shadow: 0 0 0 2px rgba(0,255,225,0.16);
  background: rgba(255,255,255,0.12);
}
/* 在极窄屏幕下改为单列，避免拥挤 */
@media (max-width: 360px) {
  #tokenSettingsForm.form-compact .fields-grid { grid-template-columns: 1fr; }
}
/* ===== Dashboard Step2 · 统一输入 & 排版 精修 ===== */
.page-compact .fields-grid { grid-template-columns: 1fr; }
.page-compact .field { margin-bottom: .6em; }
.page-compact .field label {
  font-size: .9em;
  line-height: 1.25;
  color: rgba(255,255,255,.85);
  font-weight: 600;
}

/* 统一所有输入组件的尺寸与风格（仅本页生效） */
.page-compact input[type="text"],
.page-compact input[type="number"],
.page-compact input[type="search"],
.page-compact input[type="email"],
.page-compact input[type="url"],
.page-compact textarea,
.page-compact #matTable input[type="text"],
.page-compact #matTable input[type="number"] {
  height: 40px !important;
  padding: 0 12px !important;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.28);
  background: rgba(255,255,255,0.08);
  color: #fff;
  box-shadow: none;
}
.page-compact input::placeholder,
.page-compact textarea::placeholder { color: rgba(255,255,255,.5); }
.page-compact input:focus,
.page-compact textarea:focus {
  border-color: #00ffe1e3;
  box-shadow: 0 0 0 2px rgba(0,255,225,.16);
  background: rgba(255,255,255,0.12);
}

/* Action Buttons 去“盒子感”并统一间距 */
.page-compact .action-buttons {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 1em 0 0 !important;
  display: flex;
  gap: .6em;
  justify-content: center;
}
.page-compact .main-btn {
  height: 40px;
  padding: 0 14px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.28);
  background: rgba(255,255,255,0.08);
  color: #fff;
}
.page-compact .main-btn:hover { border-color: #00ffe1e3; box-shadow: 0 0 0 2px rgba(0,255,225,.16); }

/* 计价表格统一行高与输入对齐 */
.page-compact #matTable th, .page-compact #matTable td { padding: .35em .4em; }
.page-compact #matTable input { height: 40px !important; }

/* 卡片与内容间距更紧凑但不拥挤 */
.page-compact .post-card { max-width: 720px; margin: 14px auto; padding: 14px; }
.page-compact .post-card h2, .page-compact .card-title { margin: .2em 0 .6em; text-align: center; }
.page-compact .post-card h3 { margin: .2em 0 .4em; }
.page-compact .post-card p { margin: .35em 0; }

/* 超窄屏优化 */
@media (max-width: 420px) { .page-compact .fields-grid { grid-template-columns: 1fr; } }
/* ===== WeCom Kf 区域：输入与排版进一步统一 ===== */
#wecomKfArea .fields-grid { grid-template-columns: 1fr; gap: .6em; }
#wecomKfArea .field { margin-bottom: .6em; }
#wecomKfArea .field label {
  font-size: .86em;
  line-height: 1.35;
  color: rgba(255,255,255,.82);
  font-weight: 600;
  word-break: break-word;   /* 长标签自动换行 */
}
#wecomKfArea input[type="text"],
#wecomKfArea input[type="number"],
#wecomKfArea input[type="search"],
#wecomKfArea input[type="email"],
#wecomKfArea input[type="url"] {
  height: 40px !important;  /* 与全页统一 */
}
#wecomKfArea hr { margin: .8em 0; border-color: #333; opacity: .8; }

/* 顶部“已保存值”网格的对齐（两列均匀对齐，行距紧凑） */
#wecomKfArea > .fields-grid .mono.muted { padding: .45em .6em; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.16); border-radius: 8px; }

/* 表单与按钮间距统一，避免空洞 */
#wecomKfForm + .action-buttons { margin-top: .8em !important; }

/* 统一指南区块的内边距与行高，避免看起来拥挤 */
#wecomKfArea .guide { margin-top: 1em; }
#wecomKfArea .guide ol { margin: .2em 0 .2em; padding-left: 1.2em; line-height: 1.7; }
#wecomKfArea .guide ul { margin: .3em 0 .3em 1em; padding-left: 1em; }

/* ===== Fix: 统一 WeCom Kf 输入为深色、并整体对齐 ===== */
#wecomKfArea .fields-grid { align-items: start; }
#wecomKfArea input,
#wecomKfArea textarea {
  -webkit-appearance: none;
  appearance: none;
  background: rgba(255,255,255,0.08) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.28) !important;
  border-radius: 10px !important;
  height: 40px !important;
  padding: 0 12px !important;
  box-shadow: none !important;
}
#wecomKfArea input::placeholder,
#wecomKfArea textarea::placeholder { color: rgba(255,255,255,.5) !important; }
#wecomKfArea input:focus,
#wecomKfArea textarea:focus { border-color:#00ffe1e3 !important; box-shadow:0 0 0 2px rgba(0,255,225,.16) !important; }

/* 表单通用：确保所有网格字段顶部对齐、标签换行不挤压 */
.page-compact .fields-grid { align-items: start; }
.page-compact .field label { word-break: break-word; }

/* 表格内输入与其他表单完全一致（覆盖行内 padding） */
.page-compact #matTable input { padding: 0 12px !important; }

/* ===== Dashboard Step2 · Minimal tidy pack (整齐/简洁) ===== */
.page-compact{--card-bg:rgba(18,18,18,.9);--card-border:rgba(255,255,255,.14);--muted:rgba(255,255,255,.72)}

/* 卡片：收紧留白，弱化边框阴影，宽度跟随父容器 */
.page-compact .post-card{max-width:100%;margin:12px auto;padding:12px;border:1px solid var(--card-border);border-radius:12px;background:var(--card-bg);box-shadow:none}
.page-compact .post-card>*+*{margin-top:.7em}
.page-compact .post-card h2,.page-compact .card-title{margin:.2em 0 .5em;text-align:center;font-size:1.05em}
.page-compact .post-card h3{margin:.1em 0 .35em;font-size:1em}
.page-compact .muted{color:var(--muted)}

/* 表单：两列对齐，间距统一，列内元素不换行挤压 */
.page-compact .fields-grid{display:grid;grid-template-columns:1fr !important;gap:.6em .7em;align-items:start}
.page-compact .field{margin-bottom:.6em;min-width:0}
.page-compact .field label{font-size:.88em;line-height:1.3;color:rgba(255,255,255,.86);font-weight:600;word-break:break-word}

/* 输入：统一深色、同高，同 padding（覆盖表格中的行内样式） */
.page-compact input[type=text],
.page-compact input[type=number],
.page-compact input[type=search],
.page-compact input[type=email],
.page-compact input[type=url],
.page-compact textarea,
.page-compact #matTable input[type=text],
.page-compact #matTable input[type=number]{height:40px!important;padding:0 12px!important;border-radius:10px!important;border:1px solid rgba(255,255,255,.28)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;box-shadow:none!important;-webkit-appearance:none;appearance:none}
.page-compact input::placeholder,.page-compact textarea::placeholder{color:rgba(255,255,255,.5)!important}
.page-compact input:focus,.page-compact textarea:focus{border-color:#00ffe1e3!important;box-shadow:0 0 0 2px rgba(0,255,225,.16)!important;background:rgba(255,255,255,.12)!important}
.page-compact input[disabled]{background:rgba(255,255,255,.06)!important;color:rgba(255,255,255,.9)!important}

/* 按钮容器与按钮：统一视觉，去“盒子感” */
.page-compact .action-buttons{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin:.8em 0 0!important;display:flex;gap:.6em;justify-content:center}
.page-compact .action-buttons[style*="flex-start"]{justify-content:flex-start}
.page-compact .main-btn,.page-compact a.main-btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none!important;height:40px;padding:0 14px;border-radius:10px;border:1px solid rgba(255,255,255,.28)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;box-shadow:none!important}
.page-compact .main-btn:hover,.page-compact a.main-btn:hover{border-color:#00ffe1e3!important;box-shadow:0 0 0 2px rgba(0,255,225,.16)!important}

/* 表格：行间距与输入对齐，第三列最窄 */
.page-compact #matTable{width:100%;border-collapse:collapse}
.page-compact #matTable th,.page-compact #matTable td{padding:.35em .4em}
.page-compact #matTable thead tr{border-bottom:1px solid #333}
.page-compact #matTable td:last-child{width:1%;white-space:nowrap;text-align:right}

/* WeCom Kf 区块：已保存值的块保持统一高度与留白 */
#wecomKfArea>.fields-grid .mono.muted{padding:.45em .6em;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:8px}

/* 窄屏：改为单列 */
@media (max-width:420px){.page-compact .fields-grid{grid-template-columns:1fr}}

#wecomKfArea .fields-grid{grid-template-columns:1fr;gap:.6em}

/* ===== 单列 + 同行布局（所有输入一行一个，题目与输入同一行） ===== */
.page-compact .field { display:flex !important; align-items:center; gap:.6em; }
.page-compact .field label { margin:0 !important; min-width:8.5em !important; word-break:break-word; }
.page-compact .field input[type="text"],
.page-compact .field input[type="number"],
.page-compact .field input[type="search"],
.page-compact .field input[type="email"],
.page-compact .field input[type="url"],
.page-compact .field textarea { flex:1 1 auto !important; width:auto !important; }
/* 极窄屏下稍微放松约束，避免拥挤 */
@media (max-width:340px){
  .page-compact .field { align-items:flex-start; }
  .page-compact .field label { min-width:7.2em; }
}
 
/* ===== PrintPricing · 更整齐的版式（强覆盖） ===== */
/* 1) 表格仅保留两列：材料 / 单价 */
#printPricingArea #matTable th:last-child,
#printPricingArea #matTable td:last-child { display:none; }

/* 2) 表格输入对齐与尺寸 */
#printPricingArea #matTable input { height: 38px !important; padding: 0 12px !important; }
#printPricingArea #matTable th, #printPricingArea #matTable td { padding: .3em .4em; }

/* 3) 下方两个字段：题目在上、输入在下，避免左右错位 */
#printPricingArea .fields-grid { gap: .55em; }
#printPricingArea .field { display:flex; flex-direction:column; align-items:stretch; gap:.35em; margin-bottom:.55em; }
#printPricingArea .field label { min-width: 0; margin: 0; }

/* 4) 同步按钮弱化为辅助按钮 */
#printPricingArea #addMatRowBtn { background: transparent !important; border:1px dashed rgba(255,255,255,.28) !important; color:#fff !important; opacity:.9; }

/* 5) 按钮去系统高亮边框，保持统一 */
.page-compact .main-btn:focus, .page-compact .main-btn:focus-visible { outline:none !important; box-shadow:none !important; }

/* ===== PrintPricing · 材料行去“框子”，时间成本/溢价回到同行 ===== */
/* A. 材料表输入改为“下划线样式”，去掉大框与圆角 */
#printPricingArea #matTable input {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 0 !important;
  height: 36px !important;
  padding: 0 !important;
}
#printPricingArea #matTable input:focus {
  border-bottom-color: #00ffe1e3 !important;
  box-shadow: none !important;
}

/* B. 下方两项（设备时成本 / 溢价）：标签与输入同一行 */
#printPricingArea .fields-grid { gap: .6em; }
#printPricingArea .fields-grid .field { display:flex; flex-direction: row; align-items:center; gap:.6em; margin-bottom:.6em; }
#printPricingArea .fields-grid .field label { min-width: 8.6em; margin: 0; }
#printPricingArea .fields-grid .field input { flex: 1 1 auto; width: auto; }