/* ============ 风月楼 · 硬汉×缎面 设计系统 ============
   暖炭近黑底 + 冷钢灰阳面 + 酒红鎏金阴面 + 排版反差
   渐变只允许图卡底部酒红标签条一处 */
:root {
  --bg:        #1E1C1C;   /* 暖炭 */
  --bg-soft:   #262321;   /* 暖炭浅层/卡片 */
  --bg-panel:  #2E2A28;   /* 面板浮层 */
  --steel:     #4A4A52;   /* 混凝土钢灰 */
  --steel-lt:  #8E8E99;   /* 浅钢灰(次要文字) */
  --masc-text: #B9B6B0;   /* 主体文字 暖米 */
  --wine:      #8C3A3A;   /* 酒红 主强调 */
  --wine-deep: #5E2020;   /* 深酒红 */
  --gold:      #B8860B;   /* 鎏金(小面积) */
  --ok:        #2E9E8B;   /* 青玉 ed2k */
  --warn:      #E08E2E;
  --err:       #C94F4F;
  --line:      rgba(184,182,176,.14);
  --font-masc: "Noto Sans SC","Source Han Sans SC","PingFang SC",system-ui,sans-serif;
  --font-silk: "Noto Serif SC","Source Han Serif SC","Songti SC",serif;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--masc-text);
  font-family: var(--font-silk);
  font-size: 16px;
  line-height: 1.7;
  overflow-x: hidden;
}
button, input { font-family: var(--font-masc); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.hidden { display: none !important; }

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: var(--steel); }
::-webkit-scrollbar-track { background: var(--bg-soft); }

/* ── 登录门 ── */
.gate {
  position: fixed; inset: 0; z-index: 60;
  background: var(--bg);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.gate-inner {
  width: 100%; max-width: 320px; text-align: center;
  border: 1px solid var(--line);
  padding: 40px 28px 32px;
  background: var(--bg-soft);
}
.gate-logo {
  color: var(--wine);
  width: 44px; height: 44px; margin: 0 auto 14px;
}
.gate-title {
  margin: 0;
  font-family: var(--font-masc);
  font-weight: 900;
  font-size: 26px;
  letter-spacing: .35em;
  text-indent: .35em;
  color: var(--masc-text);
}
.gate-sub {
  margin: 6px 0 26px;
  font-size: 13px;
  color: var(--steel-lt);
  letter-spacing: .12em;
}
.gate-input {
  width: 100%;
  background: var(--bg);
  border: 1px solid var(--steel);
  color: var(--masc-text);
  padding: 12px 14px;
  font-size: 16px;
  outline: none;
  transition: border-color .15s;
}
.gate-input:focus { border-color: var(--wine); }
.gate-btn {
  display: block; width: 100%;
  margin-top: 14px;
  padding: 12px 0;
  background: var(--wine);
  color: #F3ECDF;
  border: none;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .3em;
  cursor: pointer;
  transition: background .15s;
}
.gate-btn:active { background: var(--wine-deep); }
.gate-err { color: var(--err); font-size: 13px; margin: 12px 0 0; }

/* ── 顶栏 ── */
.topbar {
  position: sticky; top: 0; z-index: 30;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  padding: 10px 14px 8px;
}
.topbar-main {
  display: flex; align-items: center; justify-content: space-between;
}
.brand {
  margin: 0;
  font-family: var(--font-masc);
  font-weight: 900;
  font-size: 20px;
  letter-spacing: .25em;
  text-indent: .25em;
  color: var(--masc-text);
}
.brand-mark { color: var(--gold); font-weight: 700; font-size: 13px; letter-spacing: 0; }
.top-actions { display: flex; gap: 8px; }
.icon-btn {
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--bg-soft);
  border: 1px solid var(--steel);
  color: var(--steel-lt);
  cursor: pointer;
  padding: 0;
}
.icon-btn svg { width: 20px; height: 20px; }
.icon-btn:active { color: var(--wine); border-color: var(--wine); }

.toolbar {
  display: flex; align-items: center; gap: 10px;
  margin-top: 10px;
}
.src-chips {
  display: flex; gap: 6px; flex-wrap: nowrap;
  overflow-x: auto;
  flex: 1 1 auto;
  scrollbar-width: none;
}
.src-chips::-webkit-scrollbar { display: none; }
.chip {
  flex: 0 0 auto;
  font-family: var(--font-masc);
  font-size: 12px;
  letter-spacing: .1em;
  padding: 6px 12px;
  background: var(--bg-soft);
  border: 1px solid var(--steel);
  color: var(--steel-lt);
  cursor: pointer;
  white-space: nowrap;
}
.chip.active { border-color: var(--wine); color: #F3ECDF; background: rgba(140,58,58,.28); }
.chip .cn { color: var(--wine); margin-left: 5px; font-size: 11px; }

.search {
  flex: 0 1 190px;
  display: flex; align-items: center; gap: 6px;
  background: var(--bg-soft);
  border: 1px solid var(--steel);
  padding: 6px 10px;
  color: var(--steel-lt);
}
.search-ic { width: 16px; height: 16px; flex: 0 0 auto; }
.search input {
  flex: 1 1 auto;
  min-width: 0;
  background: transparent;
  border: none;
  color: var(--masc-text);
  font-size: 14px;
  outline: none;
}
.search input::placeholder { color: var(--steel-lt); }

/* ── 画廊瀑布流 ── */
.gallery {
  column-count: 1;
  column-gap: 10px;
  padding: 12px;
}
@media (min-width: 520px)  { .gallery { column-count: 2; } }
@media (min-width: 780px)  { .gallery { column-count: 3; } }
@media (min-width: 1100px) { .gallery { column-count: 4; padding: 16px; } }

.card {
  break-inside: avoid;
  margin: 0 0 10px;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.card-img { position: relative; width: 100%; }
.card-img img {
  width: 100%;
  display: block;
  object-fit: cover;
  aspect-ratio: 4 / 5;
  background: var(--bg-soft);
}
/* 唯一许用的渐变：图卡底部酒红标签条 */
.card-strip {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 34px 10px 9px;
  background: linear-gradient(180deg, transparent, rgba(94,32,32,.94) 58%);
}
.card-title {
  margin: 0;
  font-family: var(--font-masc);
  font-weight: 800;
  font-size: 14px;
  line-height: 1.35;
  color: #EFE7D8;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.card-meta {
  margin-top: 5px;
  display: flex; align-items: center; gap: 7px;
  font-family: var(--font-masc);
  font-size: 11px;
  letter-spacing: .05em;
  color: var(--steel-lt);
}
.badge {
  font-family: var(--font-masc);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  padding: 1px 7px;
  border: 1px solid currentColor;
}
.badge.ed2k   { color: var(--ok); }
.badge.magnet { color: var(--wine); }
.badge.http   { color: var(--gold); }
.badge.src    { color: var(--steel-lt); border-color: var(--steel); }

.status {
  text-align: center;
  color: var(--steel-lt);
  font-size: 13px;
  padding: 22px 0 34px;
  letter-spacing: .2em;
}
.loadmore {
  display: block;
  margin: 4px auto 34px;
  padding: 12px 34px;
  background: var(--bg-soft);
  border: 1px solid var(--steel);
  color: var(--masc-text);
  font-family: var(--font-masc);
  font-size: 14px;
  letter-spacing: .2em;
  cursor: pointer;
}
.loadmore:active { border-color: var(--wine); color: var(--wine); }

/* ── 详情弹层 ── */
.detail {
  position: fixed; inset: 0; z-index: 50;
  background: var(--bg);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.detail-head {
  position: sticky; top: 0; z-index: 5;
  display: flex; justify-content: flex-end;
  background: var(--bg);
  padding: 10px 14px;
  border-bottom: 1px solid var(--line);
}
.detail-body { padding: 0 14px 40px; max-width: 760px; margin: 0 auto; }
.d-img {
  background: var(--bg-soft);
  border: 1px solid var(--line);
  margin-top: 14px;
}
.d-img img {
  width: 100%;
  max-height: 68vh;
  object-fit: contain;
  margin: 0 auto;
}
.d-meta { margin-top: 16px; }
.d-title {
  margin: 0 0 8px;
  font-family: var(--font-masc);
  font-weight: 800;
  font-size: 19px;
  line-height: 1.4;
  color: #EFE7D8;
}
.d-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag {
  font-family: var(--font-masc);
  font-size: 11px;
  letter-spacing: .06em;
  color: var(--gold);
  border: 1px solid var(--gold);
  padding: 1px 8px;
}
.d-time { color: var(--steel-lt); font-size: 12px; margin: 10px 0 0; }
.d-content {
  color: var(--masc-text);
  font-size: 14px;
  line-height: 1.8;
  white-space: pre-wrap;
  word-break: break-all;
  margin: 12px 0 0;
  max-height: 160px;
  overflow-y: auto;
  border-top: 1px dashed var(--line);
  padding-top: 12px;
}

.d-links { margin-top: 4px; }
.link-group { margin-top: 14px; }
.link-group h3 {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--font-masc);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .15em;
  margin: 0 0 7px;
}
.link-group h3 .cnt {
  font-size: 11px;
  border: 1px solid currentColor;
  padding: 0 6px;
}
.row {
  display: flex; align-items: flex-start; gap: 8px;
  margin-top: 6px;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  padding: 7px 8px;
}
.row .txt {
  flex: 1 1 auto;
  font-size: 12px;
  font-family: var(--font-masc);
  word-break: break-all;
  line-height: 1.6;
  color: var(--masc-text);
}
.row .cp {
  flex: 0 0 auto;
  background: transparent;
  border: 1px solid var(--steel);
  color: var(--steel-lt);
  width: 30px; height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.row .cp svg { width: 15px; height: 15px; }
.row .cp:active { color: var(--wine); border-color: var(--wine); }
.row.ed2k .txt { border-left: none; }
.link-group.ed2k h3   { color: var(--ok); }
.link-group.ed2k h3 .cnt { border-color: var(--ok); }
.link-group.ed2k .row { border-left: 2px solid var(--ok); }
.link-group.magnet h3 { color: var(--wine); }
.link-group.magnet h3 .cnt { border-color: var(--wine); }
.link-group.magnet .row { border-left: 2px solid var(--wine); }
.link-group.http h3   { color: var(--gold); }
.link-group.http h3 .cnt { border-color: var(--gold); }
.link-group.http .row { border-left: 2px solid var(--gold); }

.d-origin {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 20px;
  padding: 10px 18px;
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--gold);
  font-family: var(--font-masc);
  font-size: 13px;
  letter-spacing: .2em;
}
.d-origin svg { width: 15px; height: 15px; }

/* ── toast ── */
.toast {
  position: fixed; left: 50%; bottom: 34px; z-index: 70;
  transform: translateX(-50%);
  background: var(--bg-panel);
  border: 1px solid var(--wine);
  color: #EFE7D8;
  font-family: var(--font-masc);
  font-size: 13px;
  letter-spacing: .08em;
  padding: 9px 18px;
  max-width: 82vw;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ============ 策展分类层 ============
   标签/置信筛选 + 卡片徽标 + 复核队列视图
   （沿用暖炭/酒红/鎏金/钢灰 token，仅此一处酒红渐变在图卡底部） */

/* ── 筛选行（标签 / 置信度） ── */
.filter-row {
  display: flex; flex-direction: column; gap: 6px;
  margin-top: 8px;
}
.filter-group {
  display: flex; align-items: center; gap: 8px;
  min-width: 0;
}
.filter-label {
  flex: 0 0 auto;
  font-family: var(--font-masc);
  font-size: 11px; letter-spacing: .18em;
  color: var(--steel-lt);
}
.f-chips {
  flex: 1 1 auto;
  display: flex; gap: 6px; flex-wrap: nowrap;
  overflow-x: auto; scrollbar-width: none;
}
.f-chips::-webkit-scrollbar { display: none; }

/* ── 卡片标签 + 置信徽标 ── */
.card-tags {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin-top: 6px;
  min-height: 0;
}
.tag-mini {
  font-family: var(--font-masc);
  font-size: 10px; letter-spacing: .04em;
  color: var(--gold);
  border: 1px solid rgba(184,134,11,.45);
  padding: 0 5px;
  line-height: 1.5;
}
.cf {
  font-family: var(--font-masc);
  font-size: 10px; font-weight: 700; letter-spacing: .1em;
  padding: 0 5px;
  border: 1px solid currentColor;
  line-height: 1.5;
}
.cf-high { color: var(--gold); }                 /* HIGH=鎏金 */
.cf-med  { color: var(--wine); }                 /* MEDIUM=酒红 */
.cf-low  { color: var(--steel-lt); font-weight: 400; border: none; }  /* LOW=钢灰小字 */

/* ── 复核队列视图 ── */
.review {
  padding: 0 12px 40px;
  max-width: 720px; margin: 0 auto;
}
.rv-head {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: 10px;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  padding: 10px 0;
  margin-bottom: 12px;
}
.rv-title {
  margin: 0;
  font-family: var(--font-masc);
  font-weight: 800; font-size: 16px; letter-spacing: .2em;
  color: var(--masc-text);
}
.rv-count { color: var(--wine); font-size: 12px; font-family: var(--font-masc); }
.rv-list { display: flex; flex-direction: column; gap: 10px; }
.rv-item {
  display: flex; gap: 10px;
  background: var(--bg-soft);
  border: 1px solid var(--line);
  padding: 8px;
}
.rv-img {
  flex: 0 0 86px; width: 86px; height: 108px;
  object-fit: cover;
  background: var(--bg-panel);
}
.rv-meta { flex: 1 1 auto; min-width: 0; }
.rv-item-title {
  margin: 0;
  font-family: var(--font-masc);
  font-weight: 700; font-size: 13px; line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.rv-reason {
  margin: 4px 0 0;
  font-family: var(--font-masc); font-size: 12px;
  color: var(--steel-lt);
}
.rv-actions { display: flex; gap: 8px; margin-top: 8px; }
.rv-btn {
  flex: 1 1 auto;
  font-family: var(--font-masc); font-size: 12px; letter-spacing: .14em;
  padding: 7px 0;
  background: transparent; border: 1px solid currentColor;
  cursor: pointer;
}
.rv-btn.ok { color: var(--ok); }
.rv-btn.no { color: var(--err); }
.rv-btn:active { background: rgba(255,255,255,.07); }
.rv-empty {
  text-align: center; color: var(--steel-lt);
  padding: 44px 0; letter-spacing: .2em;
}