.tool-page { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
.tool-page button { margin: 0; border: 0; background: transparent; padding: 0; color: inherit; cursor: pointer; }
.tool-page .tool-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 4px 0 8px; }
.tool-page .back-chip, .tool-page .meta-chip {
  display: inline-flex; align-items: center; gap: 4px;
  min-height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid #e3d5c4; background: #fffdf8; color: #29231e; font-size: 12px; font-weight: 700;
}
.tool-page .ai-mark { display: block; margin: 0 0 5px; color: #8c4630; font-size: 13px; font-weight: 800; line-height: 1.4; }
.tool-page .kicker { display: block; margin: 0; color: #8c7058; font-size: 11px; font-weight: 800; letter-spacing: 2px; line-height: 1.4; }
.tool-page .lead { display: block; margin: 4px 0 10px; color: #8c8073; font-size: 12px; line-height: 1.5; }
.tool-page .headline { display: block; margin: 4px 0 0; color: #29231e; font-family: "Songti SC", "STSong", "Noto Serif SC", serif; font-size: 24px; font-weight: 800; line-height: 1.25; }
.tool-page .sheet { margin-top: 10px; padding: 12px; border-radius: 14px; border: 1px solid #e3d5c4; background: #fbf8f2; }
.tool-page .field {
  display: block;
  width: auto;
  height: auto;
  margin: 0 0 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.tool-page .field-label { display: block; margin-bottom: 6px; color: #8c7058; font-size: 12px; font-weight: 700; }
.tool-page .chip-row { display: flex; flex-wrap: wrap; gap: 6px; }
.tool-page .tool-chip {
  display: inline-flex;
  align-items: center;
  height: auto;
  min-height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid #e3d5c4;
  background: #fffdf8;
  color: #5c4630;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}
.tool-page .tool-chip.is-on { border-color: #29231e; background: #29231e; color: #fffdf8; }
.tool-page .tool-chip .chip-mark { width: 14px; height: 14px; flex: 0 0 14px; object-fit: contain; }
.tool-page .tool-chip.is-on .chip-mark { filter: brightness(0) invert(1); opacity: 0.94; }
.tool-page .chip-row .tool-chip { gap: 4px; padding: 0 10px 0 8px; }
.tool-page .chip-ico { position: relative; width: 14px; height: 14px; flex: 0 0 14px; }
.tool-page .chip-ico span { position: absolute; box-sizing: border-box; background: currentColor; }
.tool-page .chip-ico.is-wash span:nth-child(1) { left: 4px; top: 1px; width: 6px; height: 6px; border-radius: 50%; }
.tool-page .chip-ico.is-wash span:nth-child(2) { left: 2px; bottom: 1px; width: 10px; height: 5px; border-radius: 5px 5px 2px 2px; }
.tool-page .chip-ico.is-plain span,
.tool-page .chip-ico.is-short span,
.tool-page .chip-ico.is-long span { left: 1px; height: 1.5px; border-radius: 1px; }
.tool-page .chip-ico.is-plain span:nth-child(1) { top: 4px; width: 12px; }
.tool-page .chip-ico.is-plain span:nth-child(2) { top: 8px; width: 7px; }
.tool-page .chip-ico.is-seal span:nth-child(1) { left: 2px; top: 2px; width: 10px; height: 10px; border-radius: 2px; background: transparent; border: 1.5px solid currentColor; }
.tool-page .chip-ico.is-short span:nth-child(1) { top: 3px; width: 12px; }
.tool-page .chip-ico.is-short span:nth-child(2) { top: 6.5px; width: 8px; }
.tool-page .chip-ico.is-short span:nth-child(3) { top: 10px; width: 4px; }
.tool-page .chip-ico.is-long span:nth-child(1) { top: 3px; width: 5px; }
.tool-page .chip-ico.is-long span:nth-child(2) { top: 6.5px; width: 8px; }
.tool-page .chip-ico.is-long span:nth-child(3) { top: 10px; width: 12px; }
.tool-page .chip-ico.is-full span:nth-child(1) { left: 3px; top: 1px; width: 8px; height: 12px; border-radius: 1px; background: transparent; border: 1.5px solid currentColor; }
.tool-page .chip-ico.is-full span:nth-child(2) { left: 5px; top: 4px; width: 4px; height: 1.5px; }
.tool-page .chip-ico.is-full span:nth-child(3) { left: 5px; top: 7px; width: 4px; height: 1.5px; }
.tool-page .chip-ico.is-lead span { left: 1px; border-radius: 1px; }
.tool-page .chip-ico.is-lead span:nth-child(1) { top: 2px; width: 12px; height: 3px; }
.tool-page .chip-ico.is-lead span:nth-child(2) { top: 7px; width: 9px; height: 1.5px; }
.tool-page .chip-ico.is-lead span:nth-child(3) { top: 10px; width: 6px; height: 1.5px; opacity: 0.55; }
.tool-page .chip-ico.is-hot span:nth-child(1) { left: 5px; top: 1px; width: 4px; height: 4px; border-radius: 50%; }
.tool-page .chip-ico.is-hot span:nth-child(2) { left: 2px; top: 6px; width: 10px; height: 6px; border-radius: 6px 6px 2px 2px; }
.tool-page .picked-list { display: flex; flex-wrap: wrap; gap: 6px; margin: -4px 0 12px; }
.tool-page .picked-chip {
  min-height: 28px; padding: 0 8px; border-radius: 999px; border: 1px solid #e3d5c4; background: #fffdf8; color: #5c4630; font-size: 12px; font-weight: 700;
}
.tool-page .ins-mask { position: fixed; inset: 0; z-index: 40; background: rgba(41, 35, 30, 0.28); }
.tool-page .ins-drawer {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 41; max-height: 78vh; overflow: auto;
  padding: 14px 14px calc(18px + env(safe-area-inset-bottom)); border-radius: 16px 16px 0 0; background: #fbf8f2;
}
.tool-page .ins-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.tool-page .ins-title { display: block; color: #29231e; font-size: 16px; font-weight: 800; }
.tool-page .ins-sub { display: block; margin-top: 3px; color: #8c8073; font-size: 12px; }
.tool-page .ins-item { margin-bottom: 8px; }
.tool-page .search, .tool-page .manage-area {
  width: 100%; border: 1px solid #e3d5c4; border-radius: 12px; background: #fffdf8; color: #29231e; font: inherit; font-size: 14px;
}
.tool-page .search { height: 40px; padding: 0 12px; }
.tool-page .deai-chars { margin-top: 8px; }
.tool-page .manage-area { min-height: 140px; padding: 10px 12px; resize: vertical; }
.tool-page .manage-btn, .tool-page .actions .btn {
  min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid #e3d5c4; background: #fffdf8; color: #29231e; font-size: 13px; font-weight: 800;
}
.tool-page .actions { display: flex; gap: 8px; margin-top: 8px; }
.tool-page .actions .btn { flex: 1; }
.tool-page .actions .primary { border-color: #29231e; background: #29231e; color: #fffdf8; }
.tool-page .img-thumbs { display: flex; gap: 8px; margin: 8px 0; overflow-x: auto; }
.tool-page .img-thumb { position: relative; width: 72px; height: 72px; flex: 0 0 auto; }
.tool-page .img-thumb img { width: 72px; height: 72px; object-fit: cover; border-radius: 8px; }
.tool-page .img-thumb button { position: absolute; right: 2px; bottom: 2px; padding: 2px 6px; border-radius: 999px; background: rgba(41,35,30,.82); color: #fffdf8; font-size: 10px; }
.tool-page .hint { color: #8c8073; font-size: 12px; }
.tool-page .supplement-list { display: flex; flex-direction: column; gap: 7px; max-height: 36vh; overflow: auto; }
.tool-page .paper-item {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 9px 9px 9px 8px;
  border-radius: 11px;
  border: 1px solid #eadccb;
  background: #fffdf8;
  text-align: left;
  white-space: normal;
}
.tool-page .paper-item.is-active { border-color: #c4a574; background: linear-gradient(180deg, #f7efe2 0%, #f4ead8 100%); }
.tool-page .paper-name { display: block; overflow: hidden; color: #29231e; font-size: 14px; font-weight: 800; line-height: 1.3; white-space: nowrap; text-overflow: ellipsis; }
.tool-page .paper-desc { display: -webkit-box; margin-top: 4px; overflow: hidden; color: #8c8073; font-size: 12px; font-weight: 500; line-height: 1.45; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
@media (min-width: 768px) {
  .tool-page { padding-bottom: 32px; }
  .tool-page .headline { font-size: 24px; }
  .tool-page .sheet { max-width: 760px; }
}
