@charset "UTF-8";
/* ==========================================================================
   观看历史专用样式（纯 CSS2：float / inline-block / text-align）
   --------------------------------------------------------------------------
   按兼容模式编写：不使用 display:flex / display:grid / 媒体查询里的布局 /
   calc() / CSS 变量。现代浏览器与 360 兼容模式渲染完全一致。
   加载顺序：home.css → site.css → uhistory.css → compat.css
   排版思路与 assets/css/profile.css 一致：容器 block + :after 清浮动；
   横向排列用 inline-block，间距一律用 margin 复刻（相邻标签之间不留源码空白，
   否则行内空白会叠加在 margin 上，尺寸对不齐）。
   ========================================================================== */

/* ---- 页面容器（原站 max-w-5xl mx-auto px-4 py-6） ---- */
.uh-wrap { max-width: 1024px; margin: 0 auto; padding: 24px 16px; }
.uh-clear:after { content: ""; display: block; clear: both; }

/* ---- 标题行：返回按钮（float）+ 图标 + 标题（inline-block） ----
   原站是 flex items-center gap-2：返回按钮 32×32（p-1.5 + 20px 图标），
   间距 8px，图标 24px，标题 20px/28px。 ---- */
.uh-head { display: block; margin-bottom: 24px; }
.uh-back {
  display: block;
  float: left;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  color: #6a7282;
  text-align: center;
  line-height: 32px;
  text-decoration: none;
  /* 这块只装返回箭头：font-size: 0 把字体度量从行盒里去掉，
     line-height 居中才是精确的（同 profile.css 的 .pf-entry-icon） */
  font-size: 0;
}
.uh-back:hover { background-color: #f3f4f6; }
/* home.css 的 preflight 把 svg 设成了 display:block，不加这句图标会掉到
   按钮左上角（行内元素才吃 text-align + line-height 的居中） */
.uh-back svg { display: inline-block; vertical-align: middle; }
.uh-head-main { margin-left: 40px; line-height: 32px; }
.uh-head-main .uh-ic { display: inline-block; vertical-align: middle; }
.uh-head-main .uh-ic svg { vertical-align: middle; }
.uh-h1 {
  display: inline-block;
  vertical-align: middle;
  margin-left: 8px;
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  color: #101828;
}

/* ---- 未登录门卡（与 profile.css 的 .pf-gate-* 同一套写法） ---- */
.uh-gate-wrap { text-align: center; padding: 72px 16px 48px; }
.uh-gate-card {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  background-color: #ffffff;
  border: 1px solid #f3f4f6;
  border-radius: 16px;
  padding: 40px;
  max-width: 384px;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
}
/* 渐变仍由 site.css 的 .bg-gradient-to-br.from-blue-400.to-cyan-500 提供，
   这里的 background-color 只是老 IE 无渐变时的纯色兜底。 */
.uh-gate-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 20px;
  border-radius: 50%;
  background-color: #00b8db;
  text-align: center;
  line-height: 80px;
  font-size: 0;   /* 只装图标，同上 */
}
.uh-gate-icon svg { display: inline-block; vertical-align: middle; }

/* ---- 历史列表（原站 space-y-3：行间距 12px，且末行之后不留空）
   行间距写在「上外边距」上并抹掉第一行，容器高度与后续区块位置和原站一致。 ---- */
.uh-list { display: block; }
.uh-row {
  display: block;
  margin-top: 12px;
  background-color: #ffffff;
  border: 1px solid #f3f4f6;
  border-radius: 12px;
  padding: 12px;
  color: inherit;
  text-decoration: none;
}
.uh-list > .uh-row:first-child { margin-top: 0; }
.uh-row:hover {
  border-color: #e5e7eb;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
}
.uh-row:after { content: ""; display: block; clear: both; }

/* 封面：原站 w-16 h-20（64×80，3:4）圆角 8px，固定像素不是比例容器 */
.uh-cover {
  float: left;
  width: 64px;
  height: 80px;
  background-color: #f3f4f6;
  border-radius: 8px;
  overflow: hidden;
}
.uh-cover img { display: block; width: 100%; height: 100%; }
.uh-cover-ph {
  display: block;
  width: 100%;
  height: 100%;
  padding-top: 33px;   /* (80 - 14) / 2：单行 12px 文字竖直居中 */
  text-align: center;
  color: #d1d5dc;
  font-size: 12px;
}
/* 文字块：原站 flex items-center，80px 封面比 64px 文字块高，文字整体下移 8px
   （(80 - 64) / 2）；用上内边距复刻，不用 flex。 ---- */
.uh-main { margin-left: 76px; padding-top: 8px; }
.uh-title {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: #1e2939;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uh-meta { display: block; margin-top: 4px; }
.uh-meta:after { content: ""; display: block; clear: both; }
.uh-tag {
  display: inline-block;
  vertical-align: middle;
  font-size: 10px;
  line-height: 16px;
  padding: 2px 6px;
  border-radius: 4px;
}
/* 进度文案（原站 flex 行里的 truncate）：行内块 + 百分比上限，
   老内核没有 calc()，用 max-width 百分比保证不与题材标签换行 */
.uh-progress {
  display: inline-block;
  vertical-align: middle;
  margin-left: 8px;
  max-width: 72%;
  font-size: 12px;
  line-height: 16px;
  color: #99a1af;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.uh-time { display: block; margin-top: 4px; font-size: 11px; line-height: 16px; color: #99a1af; }

/* ---- 空态（原站 bg-white rounded-xl border py-16 text-center） ---- */
.uh-empty {
  background-color: #ffffff;
  border: 1px solid #f3f4f6;
  border-radius: 12px;
  padding: 64px 16px;
  text-align: center;
}
.uh-empty .uh-empty-icon { display: block; margin: 0 auto 12px; }
.uh-empty .uh-empty-t { font-size: 14px; color: #99a1af; margin-bottom: 4px; }
.uh-empty .uh-empty-d { font-size: 12px; color: #d1d5dc; margin-bottom: 24px; }

/* ---- 按钮（颜色走工具类：bg-primary-500 / bg-white border border-gray-200 等）
   原站两个按钮之间是 gap-3 = 12px，用相邻选择器补左外边距，
   标签之间不留源码空白，间距才正好 12px。 ---- */
.uh-btns { display: block; text-align: center; }
.uh-btn {
  display: inline-block;
  border-radius: 12px;
  font-family: inherit;
  text-decoration: none;
  cursor: pointer;
}
.uh-btn + .uh-btn { margin-left: 12px; }