/* ============================================================
   UBB 精美组件（ubb_plus v1 · 2026-09-17）
   帖子/回复正文扩展样式：高亮/标题/提示框/卡片/徽章/按钮/折叠/表格等
   ============================================================ */
.ubb-hl { background: #fff3b0; padding: 1px 4px; border-radius: 3px; }
.ubb-title { display: flex; align-items: center; font-size: 18px; font-weight: 700; color: #222; margin: 24px 0 12px; line-height: 1.4; }
.ubb-title::before { content: ""; flex: 0 0 auto; width: 4px; height: 18px; margin-right: 10px; border-radius: 2px; background: linear-gradient(180deg, #4a90d9, #6bb3f0); }
.ubb-subtitle { text-align: center; color: #999; font-size: 14px; margin: 0 0 18px; line-height: 1.6; }
.ubb-caption { text-align: center; color: #999; font-size: 13px; margin: 6px 0 16px; line-height: 1.6; }
.ubb-sep { border: 0; height: 1px; margin: 22px 0; background: linear-gradient(90deg, transparent, #d9d9d9, transparent); }
.ubb-note, .ubb-warn, .ubb-tip { border-radius: 8px; padding: 12px 16px; margin: 14px 0; font-size: 14px; line-height: 1.75; border-left: 4px solid; }
.ubb-note { background: #f0f7ff; border-color: #4a90d9; color: #2a5d8f; }
.ubb-warn { background: #fff8e6; border-color: #f5a623; color: #8a5d00; }
.ubb-tip { background: #f0faf2; border-color: #52c41a; color: #2d6a1f; }
.ubb-card { background: #fff; border: 1px solid #ececec; border-radius: 10px; padding: 16px 18px; margin: 16px 0; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04); }
.ubb-card-title { font-weight: 700; font-size: 15px; color: #333; padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px dashed #eee; }
.ubb-badge { display: inline-block; background: #eef4ff; color: #3b6fd4; font-size: 12px; line-height: 1.8; padding: 0 10px; border-radius: 999px; margin: 0 3px; vertical-align: 1px; }
.ubb-button { display: inline-block; background: linear-gradient(135deg, #4a90d9, #6bb3f0); color: #fff !important; text-decoration: none !important; font-size: 14px; padding: 9px 22px; border-radius: 999px; margin: 10px 6px 10px 0; box-shadow: 0 3px 10px rgba(74, 144, 217, 0.3); transition: transform 0.15s ease, box-shadow 0.15s ease; }
.ubb-button:hover { transform: translateY(-1px); box-shadow: 0 5px 14px rgba(74, 144, 217, 0.42); }
.ubb-fold { border: 1px solid #ececec; border-radius: 10px; margin: 14px 0; overflow: hidden; background: #fafbfc; }
.ubb-fold > summary { cursor: pointer; padding: 11px 16px; font-weight: 600; font-size: 14px; color: #333; list-style: none; user-select: none; }
.ubb-fold > summary::-webkit-details-marker { display: none; }
.ubb-fold > summary::before { content: "▸"; display: inline-block; margin-right: 8px; color: #4a90d9; transition: transform 0.2s ease; }
.ubb-fold[open] > summary::before { transform: rotate(90deg); }
.ubb-fold-body { padding: 2px 16px 14px; font-size: 14px; line-height: 1.75; color: #444; }
.ubb-quote { background: #fafafa; border-left: 4px solid #d0d0d0; border-radius: 0 8px 8px 0; padding: 10px 14px; margin: 14px 0; color: #666; font-size: 14px; line-height: 1.75; }
.ubb-code { background: #f6f8fa; border: 1px solid #eaeef2; border-radius: 8px; padding: 12px 14px; margin: 14px 0; overflow-x: auto; font-family: Consolas, Menlo, Monaco, monospace; font-size: 13px; line-height: 1.7; color: #333; white-space: pre-wrap; word-break: break-word; }
.ubb-table-wrap { overflow-x: auto; margin: 16px 0; }
.ubb-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ubb-table th, .ubb-table td { border: 1px solid #e8e8e8; padding: 8px 12px; text-align: left; line-height: 1.6; }
.ubb-table th { background: #f7f9fc; font-weight: 600; color: #333; }
.ubb-table tr:nth-child(even) td { background: #fafbfc; }

/* 移动端微调 */
@media (max-width: 640px) {
  .ubb-title { font-size: 17px; }
  .ubb-button { display: block; text-align: center; margin-right: 0; }
  .ubb-card { padding: 14px; }
}