[x-cloak] { display: none !important; }

/* 纸纹噪点背景 —— 营造工作室质感 */
.grain {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
body > .flex { position: relative; z-index: 1; }

/* 表单字段 */
.field-label {
  display: block; font-size: 11px; letter-spacing: 0.04em;
  color: #6b6358; margin-bottom: 6px; font-weight: 500;
}
.field {
  width: 100%; height: 42px; padding: 0 14px;
  background: #f3efe7; border: 1px solid #e3dccd; border-radius: 10px;
  font-size: 14px; color: #211d18; transition: all 0.15s ease;
  font-family: inherit;
}
textarea.field { padding: 12px 14px; }
.field:focus {
  outline: none; border-color: #cf4527; background: #fffdf9;
  box-shadow: 0 0 0 3px rgba(207,69,39,0.12);
}
.field::placeholder { color: #b3aa99; }

/* 分段过滤器 */
.seg {
  display: inline-flex; background: #ece5d8; border-radius: 10px;
  padding: 3px; border: 1px solid #e3dccd;
}
.seg button {
  padding: 5px 11px; font-size: 12.5px; border-radius: 7px;
  color: #6b6358; transition: all 0.15s ease; white-space: nowrap;
}
.seg button.on { background: #fffdf9; color: #211d18; box-shadow: 0 1px 4px rgba(0,0,0,0.08); }
.seg button:not(.on):hover { color: #211d18; }

/* 卡片操作按钮 */
.act {
  padding: 5px 10px; border-radius: 8px; color: #6b6358;
  transition: all 0.15s ease; font-weight: 500;
}
.act:hover:not(:disabled) { background: #f3efe7; color: #211d18; }
.act:disabled { opacity: 0.4; cursor: not-allowed; }
.act-accent { color: #cf4527; }
.act-accent:hover { background: #f6e2d8 !important; color: #cf4527 !important; }
.icon-btn {
  display: grid; place-items: center; width: 30px; height: 30px;
  border-radius: 8px; color: #6b6358; transition: all 0.15s ease;
}
.icon-btn:hover { background: #f3efe7; color: #211d18; }

/* 弹窗 */
.modal-bg {
  position: fixed; inset: 0; z-index: 40; display: grid; place-items: center;
  padding: 20px; background: rgba(33,29,24,0.34); backdrop-filter: blur(4px);
}
.modal-card {
  width: 100%; max-width: 30rem; background: #fffdf9; border-radius: 22px;
  padding: 28px; box-shadow: 0 30px 80px -20px rgba(33,29,24,0.5);
  border: 1px solid #e3dccd;
}

/* 正常/待处理 主分类 Tab */
.vtab {
  padding: 9px 6px; margin-right: 22px; font-size: 15px; color: #6b6358;
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: all 0.15s ease;
  font-family: 'Fraunces', serif;
}
.vtab-on { color: #211d18; border-bottom-color: #cf4527; }
.vtab:hover:not(.vtab-on) { color: #211d18; }

/* 细滚动条 */
.thin-scroll::-webkit-scrollbar { width: 6px; }
.thin-scroll::-webkit-scrollbar-thumb { background: #d8d0bf; border-radius: 99px; }
.thin-scroll::-webkit-scrollbar-track { background: transparent; }

/* 入场动画 */
@keyframes reveal { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.reveal { animation: reveal 0.5s cubic-bezier(0.16,1,0.3,1) both; }

.line-clamp-4 {
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
  overflow: hidden;
}