/* 天涯茶吧 / TIANYA TEA BAR
 * 灰暗 · 地下 · 非主流 · 摇滚说唱皮肤
 * 纯 CSS，无外部字体与脚本依赖，可直接部署到 Cloudflare Pages。
 */
:root {
  --bg: #0c0c0e;
  --panel: #151517;
  --panel-2: #1b1b1e;
  --panel-3: #101012;
  --line: #303034;
  --line-soft: #242427;
  --text: #d8d5cf;
  --text-2: #aaa7a0;
  --dim: #83817c;
  --muted: #6c6a66;
  --link: #c9c5bc;
  --red: #d23a2f;
  --red-dark: #8f241c;
  --orange: #e2641c;
  --acid: #d3c33a;
  --cyan: #4b8d90;
  --ink: #08080a;
  --shadow: rgba(0, 0, 0, .72);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  font: 13px/1.75 "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "Hiragino Sans GB", Arial, sans-serif;
  background-color: var(--bg);
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.014) 0 1px, transparent 1px 3px),
    radial-gradient(ellipse at 50% -10%, #1d1d21 0%, #0c0c0e 62%);
  background-attachment: fixed;
}
/* 全站噪点 */
body::before {
  content: ""; position: fixed; inset: 0; z-index: 9998; pointer-events: none; opacity: .26;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='140' height='140' filter='url(%23n)' opacity='.32'/></svg>");
}
a { color: var(--link); text-decoration: none; transition: color .15s, background .15s; }
a:hover { color: var(--orange); text-decoration: none; }
a:visited { color: #9a978f; }
img { border: 0; vertical-align: middle; max-width: 100%; }
input, select, textarea, button { font-family: inherit; font-size: 13px; }
h1, h2, h3, h4, p, ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
b, strong { color: #ece9e2; }
.clearfix::after { content: ""; display: block; clear: both; }
.hide { display: none !important; }
.muted { color: var(--muted); }
.center { text-align: center; }
.wrap { width: 1040px; max-width: calc(100% - 28px); margin: 0 auto; }

/* 深色主题下覆盖页面里遗留的浅色内联样式 */
[style*="color:#666"], [style*="color:#777"], [style*="color:#555"],
[style*="color:#888"], [style*="color:#999"], [style*="color:#aaa"],
[style*="color:#0b539f"], [style*="color:#333"], [style*="color:#456"] { color: var(--dim) !important; }
[style*="color:#c00"], [style*="color:#b00"] { color: var(--red) !important; }
[style*="background:#f0faef"] { background: #1b261a !important; color: #8fb98f !important; border-color: #3a5237 !important; }
[style*="background:#fff"], [style*="background: #fff"] { background: var(--panel-2) !important; }

/* ---------- 顶部 ---------- */
#site-header { background: var(--ink); border-bottom: 1px solid var(--line); }
.topbar {
  height: 28px; line-height: 28px; background: #08080a;
  border-bottom: 1px solid var(--line-soft); color: var(--muted); font-size: 11px;
  font-family: Consolas, "Courier New", monospace; letter-spacing: 1px;
}
.topbar .wrap { text-align: right; }
.topbar a { color: var(--dim); margin: 0 5px; }
.topbar a:hover { color: var(--orange); }
.topbar .fl { float: left; color: #5c5b58; }

.masthead { min-height: 92px; padding: 14px 0 12px; position: relative; }
.logo { float: left; display: flex; align-items: center; gap: 14px; }
.logo-mark {
  width: 60px; height: 60px; border: 3px solid var(--red);
  display: flex; align-items: center; justify-content: center;
  color: var(--red); background: #171214;
  font: 900 32px/1 "SimHei", "黑体", "Microsoft YaHei", sans-serif;
  transform: rotate(-6deg); box-shadow: 4px 4px 0 #000, inset 0 0 0 2px #2a1a18;
  text-shadow: 2px 2px 0 #000;
}
.logo-text h1 {
  font: 900 36px/1 "Arial Black", "SimHei", "黑体", "Microsoft YaHei", sans-serif;
  color: #e7e3da; letter-spacing: 5px; text-shadow: 3px 3px 0 #000, -1px -1px 0 #000;
}
.logo-text h1 em { font-style: normal; color: var(--red); }
.logo-text p {
  color: var(--muted); font: 10px/1.5 Consolas, "Courier New", monospace;
  letter-spacing: 1.6px; margin-top: 6px;
}
.mast-right { float: right; text-align: right; padding-top: 10px; }
.mast-right .slogan {
  color: var(--acid); font: 700 14px/1.4 "SimHei", "Microsoft YaHei", sans-serif;
  letter-spacing: 2px; transform: rotate(-1deg); display: inline-block;
  border-bottom: 2px dashed var(--acid); padding-bottom: 3px;
}
.mast-search { margin-top: 12px; }
.mast-search input {
  width: 176px; height: 27px; padding: 3px 8px; border: 1px solid var(--line);
  background: #0b0b0d; color: var(--text); outline: 0;
}
.mast-search input::placeholder { color: #5b5a57; }
.mast-search button {
  height: 29px; padding: 0 14px; border: 1px solid var(--red); background: var(--red);
  color: #fff; cursor: pointer; font-weight: 900; letter-spacing: 2px;
}
.mast-search button:hover { background: var(--orange); border-color: var(--orange); }

.nav {
  background: repeating-linear-gradient(90deg, #17171a 0 3px, #131315 3px 6px);
  border-top: 1px solid #2a2a2e; border-bottom: 3px solid var(--red);
  min-height: 36px; line-height: 34px;
}
.nav .wrap { display: flex; flex-wrap: wrap; }
.nav a {
  display: block; padding: 0 14px; color: #b9b6ae; font-weight: 900; font-size: 13px;
  border-right: 1px solid #2c2c30; letter-spacing: 1px;
}
.nav a:visited { color: #b9b6ae; }
.nav a:hover, .nav a.on { background: var(--red); color: #fff; text-decoration: none; }
.nav .nav-tail { margin-left: auto; font: 10px/34px Consolas, monospace; color: #6c6a66; padding-right: 8px; letter-spacing: 1px; }

/* 全站标语条 */
.slogan-strip {
  background: var(--red); color: #fff; border-bottom: 3px solid #000;
  overflow: hidden; position: relative;
}
.slogan-strip::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(135deg, transparent 0 12px, rgba(0,0,0,.09) 12px 14px);
}
.slogan-strip .wrap { display: flex; align-items: baseline; gap: 18px; padding: 5px 0; position: relative; z-index: 1; }
.strip-big { font: 900 20px/1.2 "Arial Black", "SimHei", "Microsoft YaHei", sans-serif; letter-spacing: 6px; }
.strip-sub { font: 10px/1.2 Consolas, monospace; letter-spacing: 2px; opacity: .85; }

.userbar {
  background: #111113; border: 1px solid var(--line-soft); border-top: 0;
  padding: 7px 12px; color: var(--dim); line-height: 21px;
}
.userbar .hi { color: var(--orange); font-weight: 900; }
.userbar .role {
  display: inline-block; padding: 0 6px; margin: 0 4px; border: 1px solid #5a4a2a;
  background: #241e12; color: var(--acid); font-size: 11px; font-weight: 700;
}
.userbar .role-admin { border-color: var(--red); background: #2a1412; color: #ff7b6b; }
.userbar .right { float: right; }
.userbar a { margin: 0 3px; }
.userbar .sep { color: #3b3b3e; }
.crumb { margin: 14px 0 10px; color: var(--muted); font: 11px/1.6 Consolas, "Microsoft YaHei", monospace; letter-spacing: 1px; }
.crumb b { color: var(--acid); }
.crumb a { color: var(--dim); }

/* ---------- 首屏 HERO ---------- */
.hero {
  position: relative; overflow: hidden; isolation: isolate;
  border-bottom: 4px solid var(--red); background: #08080a;
}
.hero-bg {
  position: absolute; inset: 0; z-index: -2;
  background: linear-gradient(90deg, rgba(8,8,10,.97) 0%, rgba(8,8,10,.9) 42%, rgba(8,8,10,.55) 100%),
              linear-gradient(0deg, rgba(8,8,10,.95), transparent 55%),
              url("img/tea-bg.webp") center/cover no-repeat;
  filter: grayscale(.75) contrast(1.15);
}
.hero-grain {
  position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 4px);
}
.hero-inner { display: flex; gap: 34px; align-items: center; padding: 46px 0 54px; }
.hero-left { flex: 1 1 52%; min-width: 0; }
.hero-kicker {
  display: inline-block; font: 10px/1.5 Consolas, monospace; letter-spacing: 2.2px;
  color: var(--acid); border: 1px dashed #6a6327; padding: 4px 9px; margin-bottom: 18px;
  transform: rotate(-1.5deg); background: rgba(20,20,12,.6);
}
.hero-title {
  position: relative; display: inline-block; margin: 0 0 6px;
  font: 900 clamp(46px, 6.2vw, 88px)/1.08 "Arial Black", "SimHei", "黑体", "Microsoft YaHei", sans-serif;
  color: #f0ece3; letter-spacing: 4px; white-space: nowrap;
  transform: rotate(-2deg); text-shadow: 5px 5px 0 #000, 8px 8px 0 rgba(210,58,47,.55);
  -webkit-text-stroke: 1px #000;
}
.hero-title::before, .hero-title::after {
  content: attr(data-text); position: absolute; left: 0; top: 0; width: 100%;
  pointer-events: none; opacity: .65;
}
.hero-title::before { color: var(--red); transform: translate(-3px, 2px); clip-path: inset(12% 0 58% 0); }
.hero-title::after { color: var(--cyan); transform: translate(3px, -2px); clip-path: inset(62% 0 8% 0); }
.hero-rule { width: 96px; height: 6px; background: var(--red); margin: 20px 0 16px; transform: rotate(-2deg); box-shadow: 0 0 0 2px #000; }
.hero-sub { color: #b6b2aa; font-size: 15px; line-height: 2; letter-spacing: 1px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 20px; }
.btn-hero {
  display: inline-block; padding: 11px 20px; background: var(--red); color: #fff;
  border: 2px solid #000; box-shadow: 5px 5px 0 #000; font-weight: 900; letter-spacing: 1px;
  transform: rotate(-1deg);
}
.btn-hero:hover { background: var(--orange); color: #fff; transform: rotate(0deg) translate(2px,2px); box-shadow: 3px 3px 0 #000; }
.btn-hero.ghost { background: transparent; color: #e6e2d9; border-color: #6c6a66; box-shadow: 5px 5px 0 #000; }
.btn-hero.ghost:hover { background: #232326; color: #fff; border-color: var(--acid); }
.hero-stats { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font: 11px/1.6 Consolas, "Microsoft YaHei", monospace; color: var(--dim); }
.hero-stats b { color: var(--acid); font-size: 15px; }
.hero-stats i { color: #454548; font-style: normal; }
.hero-right { flex: 0 1 44%; min-width: 0; }

/* 视频框：磁带 / 取景框 / 胶带 */
.video-frame {
  border: 2px solid #4a4a4e; background: #0a0a0c; padding: 0 0 10px;
  box-shadow: 10px 10px 0 rgba(0,0,0,.75), 0 0 0 1px #000;
  transform: rotate(1deg);
}
.video-tape {
  background: var(--red); color: #fff; font: 700 10px/1.8 Consolas, monospace;
  letter-spacing: 1.5px; padding: 4px 10px; display: flex; justify-content: space-between;
}
.video-tape span:first-child { color: #fff; animation: rec 1.4s steps(1) infinite; }
.video-tape span:last-child { opacity: .8; }
@keyframes rec { 50% { opacity: .25; } }
.video-stage { position: relative; background: #000; overflow: hidden; }
.video-stage video { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; filter: grayscale(.35) contrast(1.08); }
.video-stamp {
  position: absolute; left: 10px; bottom: 8px; font: 9px/1.4 Consolas, monospace;
  letter-spacing: 1.4px; color: rgba(255,255,255,.72); background: rgba(0,0,0,.55);
  padding: 2px 6px; pointer-events: none;
}
.video-corner { position: absolute; width: 16px; height: 16px; border: 2px solid var(--red); pointer-events: none; }
.video-corner.tl { top: 6px; left: 6px; border-right: 0; border-bottom: 0; }
.video-corner.tr { top: 6px; right: 6px; border-left: 0; border-bottom: 0; }
.video-corner.bl { bottom: 6px; left: 6px; border-right: 0; border-top: 0; }
.video-corner.br { bottom: 6px; right: 6px; border-left: 0; border-top: 0; }
.video-fallback {
  position: absolute; inset: 0; margin: auto; width: 150px; height: 40px;
  background: var(--red); color: #fff; border: 2px solid #fff; font-weight: 900; cursor: pointer;
}
.video-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 10px 0; }
.video-ctl button {
  background: #1e1e21; color: #dedad1; border: 1px solid #4a4a4e; padding: 5px 10px;
  cursor: pointer; font-size: 11px; font-weight: 700;
}
.video-ctl button:hover { background: var(--red); border-color: var(--red); color: #fff; }
.video-note { font: 10px/1.5 Consolas, monospace; color: var(--muted); letter-spacing: .5px; }
.video-cap { font: 10px/1.7 Consolas, monospace; color: #6c6a66; margin-top: 12px; letter-spacing: .6px; }
.hero-bottom {
  text-align: center; font: 10px/1.6 Consolas, monospace; letter-spacing: 3px;
  color: #6c6a66; padding: 7px 0; border-top: 1px solid #1e1e21; background: #08080a;
}

/* ---------- 主体框架 ---------- */
.main { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 22px; }
.col-main { flex: 1 1 auto; min-width: 0; }
.col-side { flex: 0 0 240px; }
.box {
  background: var(--panel); border: 1px solid var(--line); margin-bottom: 14px;
  box-shadow: 4px 4px 0 rgba(0,0,0,.45); position: relative;
}
.box-hd {
  min-height: 34px; line-height: 34px; padding: 0 12px;
  background: repeating-linear-gradient(135deg, #1e1e21 0 8px, #1a1a1d 8px 16px);
  border-bottom: 2px solid var(--red); color: #e8e4dc; font-weight: 900; letter-spacing: 2px;
  font-size: 14px;
}
.box-hd .more { float: right; font-weight: 400; font-size: 11px; letter-spacing: 0; color: var(--dim); }
.box-hd .tag { color: var(--acid); font: 10px/1 Consolas, monospace; margin-left: 9px; letter-spacing: 1px; }
.box-bd { padding: 12px; }

/* 首页：神贴精选卡片 */
.box-featured .box-hd { border-bottom-color: var(--acid); }
.archive-intro {
  color: var(--text-2); border-left: 3px solid var(--red); padding: 6px 0 6px 11px;
  margin-bottom: 14px; font-size: 12px; line-height: 1.9; background: rgba(210,58,47,.05);
}
.legend-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.legend-card {
  display: block; background: var(--panel-2); border: 1px solid var(--line);
  overflow: hidden; color: var(--text);
}
.legend-card:hover { border-color: var(--red); background: #1f1a1a; color: var(--text); }
.lg-img { position: relative; height: 88px; overflow: hidden; background: #000; }
.lg-img img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.55) contrast(1.1); transition: transform .3s, filter .3s; }
.legend-card:hover .lg-img img { transform: scale(1.07); filter: grayscale(.15) contrast(1.05); }
.lg-no {
  position: absolute; left: 0; bottom: 0; background: var(--red); color: #fff;
  font: 700 10px/1.6 Consolas, monospace; padding: 1px 7px; letter-spacing: 1px;
}
.lg-body { padding: 8px 9px 10px; }
.lg-tag { display: block; color: var(--acid); font: 10px/1.5 Consolas, monospace; letter-spacing: 1px; margin-bottom: 4px; }
.lg-title {
  font-size: 12px; font-weight: 700; line-height: 1.6; height: 39px; overflow: hidden;
  color: #dedad2;
}
.lg-meta { color: var(--muted); font: 10px/1.7 Consolas, monospace; margin-top: 6px; }

/* 茶山切片 */
.box-tea .box-hd { border-bottom-color: var(--cyan); }
.tea-strip { display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px; }
.tea-shot { position: relative; display: block; height: 92px; overflow: hidden; border: 1px solid #333; filter: grayscale(.6); }
.tea-shot img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s, filter .3s; }
.tea-shot:hover { filter: none; border-color: var(--acid); }
.tea-shot:hover img { transform: scale(1.1); }
.tea-shot span {
  position: absolute; bottom: 0; left: 0; background: rgba(0,0,0,.75); color: var(--acid);
  font: 9px/1.6 Consolas, monospace; padding: 0 5px; letter-spacing: 1px;
}
.tea-caption { color: var(--muted); font-size: 11px; margin-top: 10px; letter-spacing: .5px; }

/* 侧栏匿名档案 */
.box-archive .box-hd { border-bottom-color: var(--acid); background: #1c1a13; }
.archive-cover { display: block; height: 96px; overflow: hidden; border: 1px solid #333; margin-bottom: 9px; }
.archive-cover img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.7) contrast(1.15); }
.archive-note { color: var(--text-2); font-size: 11px; line-height: 1.9; margin-bottom: 10px; }
.box-archive .btn { width: 100%; }

/* 首页版块表 */
.board-cat {
  background: #1e1e21; border-bottom: 1px solid var(--line); border-left: 4px solid var(--red);
  padding: 6px 11px; font-weight: 900; color: #e0dcd4; letter-spacing: 2px; font-size: 13px;
}
.board-cat span { font-weight: 400; color: var(--muted); margin-left: 10px; font: 10px Consolas, monospace; letter-spacing: 1px; }
table.grid { width: 100%; border-collapse: collapse; }
table.grid th {
  background: #1a1a1d; color: #8b8983; font-weight: 400; text-align: center;
  padding: 6px; border-bottom: 1px solid var(--line); font-size: 11px; letter-spacing: 1px;
}
table.grid td { padding: 8px; border-bottom: 1px dashed #2a2a2d; vertical-align: middle; }
table.grid tr:last-child td { border-bottom: 0; }
table.grid tr:hover td { background: #1d1d20; }
.cell-icon { width: 60px; text-align: center; }
.bthumb { width: 46px; height: 34px; object-fit: cover; border: 1px solid #3a3a3e; filter: grayscale(.65) contrast(1.1); }
.bicon {
  display: inline-block; width: 30px; height: 30px; line-height: 28px; text-align: center;
  border: 1px solid var(--red); background: #241414; color: var(--red);
  font: 900 13px/28px "SimHei", sans-serif; transform: rotate(-4deg);
}
.bname { font-size: 14px; font-weight: 900; color: #ddd9d1; letter-spacing: 1px; }
.bname:hover { color: var(--red); }
.bdesc { color: var(--dim); font-size: 11px; margin-top: 3px; }
.num { color: var(--text-2); font-family: Consolas, monospace; }
.num b { color: var(--acid); }
.last { color: var(--dim); font-size: 11px; width: 168px; }
.last a { color: #a9a59d; }

/* 帖子列表 */
.thread-toolbar { padding: 9px 11px; border-bottom: 1px solid var(--line); background: var(--panel-2); }
.btn {
  display: inline-block; min-height: 26px; line-height: 24px; padding: 0 13px;
  border: 1px solid #4a4a4e; background: #1e1e21; color: #d6d2ca;
  cursor: pointer; text-align: center; font-weight: 700; letter-spacing: 1px;
}
.btn:hover { background: #2c2c30; border-color: var(--acid); color: #fff; text-decoration: none; }
.btn-primary { border-color: var(--red); background: var(--red); color: #fff; }
.btn-primary:hover { background: var(--orange); border-color: var(--orange); color: #fff; }
.btn-mini { min-height: 21px; line-height: 19px; padding: 0 8px; font-size: 11px; }
.btn:disabled { opacity: .45; cursor: not-allowed; }

.badge {
  display: inline-block; padding: 0 5px; margin-right: 4px; font-size: 10px;
  border: 1px solid #4a4a4e; color: #a9a59d; line-height: 16px; font-family: Consolas, monospace;
}
.badge-legend { border-color: var(--acid); background: #26240f; color: var(--acid); }
.badge-top { border-color: var(--red); background: #2a1412; color: #ff7b6b; }
.badge-digest { border-color: var(--orange); background: #2a1a0f; color: #f2a15e; }
.badge-new { border-color: var(--cyan); background: #102123; color: #6dbfc2; }
.badge-lock { border-color: #666; background: #202023; color: #999; }
.badge-full { border-color: var(--cyan); background: #0f2224; color: #79cfd2; }
.badge-warn { border-color: var(--orange); background: #2a1a0f; color: #f2a15e; }
.badge-book { border-color: #8a6fd6; background: #1d1733; color: #b9a6ef; }

/* ---------- 内容审核队列 ---------- */
.mod-grid { display: flex; flex-direction: column; gap: 10px; }
.mod-card { border: 1px solid var(--line-soft); background: var(--panel-2); padding: 10px 12px; }
.mod-card.pending { border-color: var(--orange); background: #221a10; }
.mod-meta { font-size: 12px; color: #a9a59d; margin-bottom: 6px; }
.mod-meta .mod-type { display: inline-block; padding: 0 6px; background: #2a2a2e; border: 1px solid #4a4a4e; color: #cfc9bf; font-size: 10px; margin-right: 6px; }
.mod-meta .mod-cats { color: #f2a15e; }
.mod-text { font-size: 13px; color: #d3cfc7; line-height: 1.7; word-break: break-all; }
.mod-act { margin-top: 8px; }
.mod-act a { margin-right: 14px; font-size: 13px; }
.mod-word-row { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 10px; }
.mod-word-label { width: 120px; flex: 0 0 120px; font-size: 12px; color: #cfc9bf; padding-top: 6px; }
.mod-word-ta { flex: 1; min-height: 64px; }
.ttitle { font-size: 13px; color: #d3cfc7; }
.ttitle:hover { color: var(--red); }
.tmeta { color: var(--muted); font-size: 11px; }

/* 帖子详情 */
.legend-note {
  background: #1c1a12; border-bottom: 1px solid #4a4327; color: var(--acid);
  padding: 8px 12px; font-size: 11px; line-height: 1.9; letter-spacing: .4px;
}
.legend-note a { color: var(--orange); font-weight: 700; }

/* 全文典藏：正文 / 历史楼层 双视图 */
.legend-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 2px 2px; }
.legend-tabs a {
  display: inline-block; padding: 4px 12px; font-size: 11px; letter-spacing: .5px;
  border: 1px solid var(--line); background: var(--panel-2);
  color: var(--text-2); text-decoration: none;
}
.legend-tabs a:hover { border-color: var(--acid); color: var(--acid); }
.legend-tabs a.on { border-color: var(--acid); background: #26240f; color: var(--acid); font-weight: 700; }
.ft-empty {
  padding: 18px 14px; border: 1px dashed #4a4327; background: #15140f;
  color: var(--text-2); line-height: 2; font-size: 12px;
}
.ft-empty a { color: var(--orange); }
.ft-panel { padding: 4px 0; }
.ft-stat {
  padding: 10px 12px; background: #1c1a12; border: 1px solid #4a4327;
  color: var(--text-2); font-size: 12px; letter-spacing: .4px;
}
.ft-stat b { color: var(--acid); font-size: 15px; }
.ft-hint { color: var(--dim); font-size: 11px; line-height: 1.9; margin: 8px 0 12px; }
.ft-hint b { color: var(--orange); }
.ft-hint code { color: var(--acid); background: #20201a; padding: 1px 4px; font-family: Consolas, monospace; }
.ft-block { margin-top: 14px; padding: 12px; border: 1px solid var(--line-soft); background: var(--panel-3); }
.ft-hd { color: var(--acid); font-size: 12px; font-weight: 700; letter-spacing: 1px; margin-bottom: 8px; }
.post-table { width: 100%; border-collapse: collapse; border: 1px solid var(--line); }
.post-table td { border-bottom: 1px solid var(--line); vertical-align: top; }
.author-cell { width: 156px; background: #18181b; padding: 12px; border-right: 1px solid var(--line); }
.avatar {
  width: 66px; height: 66px; line-height: 66px; text-align: center; margin: 0 auto 8px;
  border: 2px solid var(--red); background: #201416; color: var(--red);
  font: 900 27px/64px "SimHei", sans-serif; transform: rotate(-3deg);
  box-shadow: 3px 3px 0 #000; overflow: hidden;
}
.avatar img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.5); }
.author-name { text-align: center; font-weight: 900; color: #e0dcd4; font-size: 13px; letter-spacing: 1px; }
.role-line { text-align: center; margin: 5px 0 9px; }
.role-badge {
  display: inline-block; padding: 0 5px; border: 1px solid #6a5a30; background: #241e12;
  color: var(--acid); font-size: 10px;
}
.role-badge.admin { border-color: var(--red); background: #2a1412; color: #ff7b6b; }
.role-badge.guest { border-color: #555; background: #202023; color: #999; }
.author-info { border-top: 1px dashed #343438; padding-top: 7px; color: var(--dim); line-height: 21px; font-size: 11px; }
.author-info span { color: #8e8b85; }
.content-cell { padding: 12px 14px; background: var(--panel); }
.floor-bar { border-bottom: 1px dashed #343438; padding-bottom: 6px; color: var(--muted); font: 10px/1.7 Consolas, "Microsoft YaHei", monospace; letter-spacing: 1px; }
.floor-bar .fl-no { float: right; color: var(--acid); font-weight: 700; }
.post-content { padding: 16px 2px; min-height: 100px; font-size: 13px; line-height: 2; white-space: pre-wrap; word-break: break-word; color: #cdc9c1; }
.post-sign { color: var(--muted); font-size: 11px; border-top: 1px dashed #343438; padding-top: 7px; }
.post-actions { text-align: right; padding-top: 9px; }
.post-actions a { margin-left: 9px; font-size: 11px; }

/* 表单 */
.form-table { width: 100%; border-collapse: collapse; }
.form-table th {
  width: 140px; text-align: right; padding: 9px 13px 9px 0; font-weight: 400; color: var(--text-2);
  vertical-align: top;
}
.form-table td { padding: 8px 0; }
.form-table .tip { color: var(--muted); font-size: 11px; margin-left: 8px; }
.input {
  height: 28px; padding: 4px 8px; border: 1px solid #3c3c40; background: #0d0d0f;
  color: var(--text); width: 230px; outline: 0;
}
.input:focus, textarea:focus, select:focus { outline: 0; border-color: var(--red); box-shadow: 0 0 0 2px rgba(210,58,47,.18); }
textarea.area { width: 100%; min-height: 96px; padding: 8px; border: 1px solid #3c3c40; background: #0d0d0f; color: var(--text); resize: vertical; }
select.sel { height: 28px; border: 1px solid #3c3c40; background: #0d0d0f; color: var(--text); padding: 3px; }
.captcha-box {
  display: inline-block; width: 84px; height: 28px; line-height: 28px; text-align: center;
  letter-spacing: 4px; font: 700 15px/28px "Courier New", monospace; color: var(--acid);
  background: repeating-linear-gradient(45deg, #202014 0 5px, #191910 5px 10px);
  border: 1px solid #5a5330; cursor: pointer; user-select: none; font-style: italic;
}
.field-err { color: var(--red); font-size: 11px; margin-left: 8px; }
.msg { padding: 9px 12px; margin-bottom: 11px; border: 1px solid #6a5a30; background: #241e12; color: var(--acid); }
.msg.err { border-color: var(--red); background: #2a1412; color: #ff8b7b; }
.msg.ok { border-color: var(--cyan); background: #102123; color: #7fd0d2; }

.tabs { border-bottom: 3px solid var(--red); margin-bottom: 15px; display: flex; gap: 4px; }
.tabs a {
  display: inline-block; padding: 7px 18px; border: 1px solid var(--line); border-bottom: 0;
  background: #1b1b1e; color: var(--dim); font-weight: 900; letter-spacing: 1px;
}
.tabs a.on { background: var(--red); color: #fff; border-color: var(--red); }
.tabs a.on:hover { color: #fff; text-decoration: none; }
.reg-side { background: var(--panel-2); border: 1px solid var(--line); border-left: 3px solid var(--acid); padding: 13px; line-height: 2; }
.reg-side h3 { color: var(--acid); font-size: 13px; margin-bottom: 7px; letter-spacing: 1px; }
.reg-side li { padding-left: 15px; position: relative; color: var(--text-2); font-size: 12px; }
.reg-side li::before { content: "◆"; position: absolute; left: 0; color: var(--red); font-size: 9px; }
.agree { margin: 13px 0; color: var(--text-2); }
.agree a { font-weight: 700; color: var(--orange); }

/* 侧栏 */
.side-notice { line-height: 1.9; color: var(--text-2); font-size: 12px; }
.side-notice li { padding-left: 13px; position: relative; }
.side-notice li::before { content: "·"; position: absolute; left: 2px; color: var(--red); font-weight: 900; }
.stat-list li { display: flex; justify-content: space-between; padding: 4px 0; border-bottom: 1px dashed #2c2c30; color: var(--dim); }
.stat-list li:last-child { border-bottom: 0; }
.stat-list b { color: var(--acid); font-family: Consolas, monospace; }
.online-list { color: var(--text-2); line-height: 1.9; }
.online-list a { margin-right: 9px; }
.rank-list li { padding: 4px 0; border-bottom: 1px dashed #2c2c30; }
.rank-list li:last-child { border-bottom: 0; }
.rank-no { display: inline-block; width: 20px; color: var(--muted); font-family: Consolas, monospace; }
.rank-no.top { color: var(--red); font-weight: 900; }
.sign-btn { width: 100%; }
.signed { color: var(--acid); text-align: center; padding: 5px 0; }

/* 个人中心 / 后台 */
.profile-card { display: flex; gap: 16px; padding: 4px 0 14px; border-bottom: 1px dashed #343438; }
.profile-card .avatar { margin: 0; flex: 0 0 66px; }
.profile-main { flex: 1; line-height: 2; }
.profile-main h2 { font-size: 17px; color: #e6e2d9; letter-spacing: 1px; }
.profile-kv { display: flex; flex-wrap: wrap; gap: 4px 22px; margin-top: 11px; }
.profile-kv div { width: 210px; color: var(--dim); }
.profile-kv b { color: var(--acid); }
.subnav { border-bottom: 1px solid var(--line); padding: 0 0 9px; margin-bottom: 11px; }
.subnav a { padding: 4px 11px; border: 1px solid var(--line); background: var(--panel-2); margin-right: 5px; }
.subnav a.on { background: var(--red); color: #fff; border-color: var(--red); }
.subnav a.on:hover { color: #fff; text-decoration: none; }
.admin-stat { display: flex; gap: 10px; margin-bottom: 11px; }
.admin-stat div { flex: 1; border: 1px solid var(--line); background: var(--panel-2); padding: 9px; text-align: center; }
.admin-stat b { display: block; font: 900 21px/1.4 Consolas, monospace; color: var(--acid); }
.admin-stat span { color: var(--muted); font-size: 11px; }
.op a { margin-right: 7px; }

/* 回复框 / 翻页 */
.reply-box { padding: 11px; }
.pager { padding: 11px; text-align: center; color: var(--dim); }
.pager a, .pager span {
  display: inline-block; padding: 3px 9px; border: 1px solid var(--line);
  margin: 0 2px; background: var(--panel-2); font-family: Consolas, monospace;
}
.pager a:hover { background: #2c2c30; }
.pager span.cur { background: var(--red); color: #fff; border-color: var(--red); }

/* 页脚 */
#site-footer {
  margin-top: 18px; border-top: 4px solid var(--red); background: #08080a;
  padding: 20px 0 30px; text-align: center; color: var(--muted); line-height: 2.1;
}
#site-footer .links a { margin: 0 7px; font-size: 12px; }
#site-footer .copy { font: 10px/1.9 Consolas, "Microsoft YaHei", monospace; letter-spacing: 1px; }
#site-footer .warn { color: #5c5b58; font-size: 11px; max-width: 780px; margin: 0 auto; }

/* ---------- 响应式 ---------- */
@media (max-width: 1000px) {
  .hero-inner { flex-direction: column; align-items: stretch; gap: 24px; padding: 32px 0 40px; }
  .hero-right { flex: 1 1 auto; max-width: 620px; }
  .hero-title { font-size: clamp(40px, 9vw, 72px); }
  .legend-grid { grid-template-columns: repeat(2, 1fr); }
  .main { flex-direction: column; }
  .col-side { flex: 1 1 auto; width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .col-side .box { margin-bottom: 0; }
  .nav .nav-tail { display: none; }
  .mast-right { display: none; }
}
@media (max-width: 620px) {
  .wrap { max-width: calc(100% - 20px); }
  .hero-title { letter-spacing: 1px; white-space: normal; }
  .legend-grid, .col-side { grid-template-columns: 1fr; }
  .tea-strip { grid-template-columns: repeat(3, 1fr); }
  .strip-sub { display: none; }
  .logo-text h1 { font-size: 27px; }
  .userbar .right { float: none; display: block; }
  table.grid th:last-child, table.grid td.last { display: none; }
  .author-cell { width: 100px; }
}

/* ---------- 手机触屏专项（本地手机版 / 局域网手机访问共用） ---------- */
@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; }
  body { font-size: 13px; }
  img, video, table { max-width: 100%; }
  a, button { -webkit-tap-highlight-color: transparent; }
  input, select, textarea { font-size: 16px; max-width: 100%; box-sizing: border-box; }
  .btn, .btn-hero, .btn-mini { min-height: 40px; padding-top: 9px; padding-bottom: 9px; }

  /* 导航改成横向滑动，不再折成多行挤爆 */
  .topbar { display: none; }
  .masthead { padding: 10px 0; }
  .nav .wrap { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .nav .wrap::-webkit-scrollbar { display: none; }
  .nav a { flex: 0 0 auto; white-space: nowrap; padding: 0 13px; font-size: 13px; }
  .userbar { line-height: 1.9; padding: 7px 10px; font-size: 11px; }
  .userbar .right { float: none; display: block; margin-top: 3px; }
  .crumb { font-size: 10px; margin: 10px 0 8px; white-space: normal; line-height: 1.8; word-break: break-word; }

  /* 首屏 */
  .hero-inner { padding: 24px 0 30px; gap: 18px; }
  .hero-kicker { font-size: 9px; letter-spacing: 1px; }
  .hero-title { font-size: clamp(38px, 12.5vw, 62px); letter-spacing: 0; line-height: 1.08; }
  .hero-sub { font-size: 13px; }
  .hero-actions { display: flex; flex-wrap: wrap; gap: 8px; }
  .btn-hero { font-size: 13px; padding: 10px 14px; }
  .hero-stats { font-size: 10px; line-height: 2; }
  .hero-bottom { font-size: 9px; letter-spacing: 1px; }
  .video-frame { transform: none; }
  .video-tape, .video-cap { font-size: 9px; }
  .video-ctl { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .video-ctl button { flex: 1 1 auto; }
  .video-note { flex: 1 1 100%; font-size: 9px; }
  .video-stamp { font-size: 8px; }

  /* 版块 / 帖子列表：窄屏横向滑动，保留全部列 */
  .box-bd { padding: 10px; }
  .box-hd { font-size: 13px; padding: 9px 10px; }
  .box-hd .more, .box-hd .tag { font-size: 10px; }
  table.grid { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table.grid th, table.grid td { white-space: nowrap; font-size: 12px; padding: 7px 6px; }
  table.grid .bname { font-size: 13px; }
  table.grid .bdesc, table.grid .last { white-space: normal; min-width: 130px; max-width: 190px; }
  .cell-icon img.bthumb { width: 38px; height: 38px; }
  .legend-grid { gap: 10px; }
  .lg-title { font-size: 14px; }
  .tea-strip { gap: 6px; }
  .tea-shot span { font-size: 8px; }

  /* 表单：标签与输入上下堆叠 */
  .form-table, .form-table tbody, .form-table tr, .form-table th, .form-table td {
    display: block; width: 100%; box-sizing: border-box; text-align: left;
  }
  .form-table th { padding: 10px 0 2px; border: 0; font-size: 13px; }
  .form-table td { padding: 2px 0 8px; border: 0; }
  .form-table input[type=text], .form-table input[type=password],
  .form-table input[type=email], .form-table input[type=tel], .form-table select,
  .form-table textarea { width: 100%; }
  .form-table .tip { display: block; margin: 3px 0 0; font-size: 10px; }
  .tabs a { padding: 10px 12px; font-size: 13px; }

  /* 帖子详情：作者信息横排，正文整宽 */
  .post-table, .post-table tbody, .post-table tr, .post-table td {
    display: block; width: 100%; box-sizing: border-box;
  }
  .post-table tr { border-bottom: 2px solid var(--line); }
  .author-cell {
    width: 100%; border-right: 0; border-bottom: 1px dashed var(--line-soft);
    padding: 8px 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  }
  .author-cell .avatar { width: 34px; height: 34px; font-size: 17px; margin: 0; }
  .author-cell .avatar img { width: 100%; height: 100%; }
  .author-name { font-size: 14px; }
  .author-info { display: none; }
  .role-line { font-size: 10px; }
  .post-content, .post-table .content-cell { padding: 12px 10px; font-size: 14px; line-height: 1.9; }
  .floor-bar, .post-meta { font-size: 10px; }
  .reply-form textarea { width: 100%; }
  #site-footer .links a { display: inline-block; margin: 3px 5px; }
  #site-footer .copy, #site-footer .warn { font-size: 10px; }

  /* 工具条 / 分页：窄屏改为换行排布，杜绝按钮被裁切 */
  .main { align-items: stretch; }
  .col-main, .col-side { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
  .box { max-width: 100%; box-sizing: border-box; }
  table.grid { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .thread-toolbar #board-meta { float: none !important; display: block; margin-bottom: 8px; line-height: 1.7; font-size: 11px; }
  .thread-toolbar > div:nth-child(2) { text-align: left !important; display: flex; flex-wrap: wrap; gap: 6px; }
  .thread-toolbar .btn { flex: 1 1 auto; text-align: center; }
  .pager { overflow-x: auto; white-space: nowrap; text-align: left; -webkit-overflow-scrolling: touch; }
  .pager a, .pager span { min-width: 30px; min-height: 34px; line-height: 32px; }
  .slogan-strip .wrap { gap: 8px; }
  .strip-big { font-size: clamp(17px, 5.4vw, 24px); }
}

/* 单文件本地手机版专用：底部快捷栏 */
#ty-mobile-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  display: none; background: #141416; border-top: 2px solid var(--red);
  box-shadow: 0 -3px 14px rgba(0,0,0,.7);
}
#ty-mobile-bar a {
  flex: 1 1 0; text-align: center; padding: 9px 2px 11px; color: #cfcbc2;
  font: 700 11px/1.3 "Microsoft YaHei", sans-serif; text-decoration: none;
  border-right: 1px solid #2b2b2e;
}
#ty-mobile-bar a.on { color: var(--acid); background: #202024; }
@media (max-width: 760px) {
  #ty-mobile-bar { display: flex; }
  body.ty-offline { padding-bottom: 52px; }
}

/* ---------- 会员门禁：全文典藏需注册登录 ---------- */
.badge-member { border-color: var(--acid); background: #2b2810; color: #e7d75b; }
.gate-banner {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px;
  padding: 11px 14px; border-bottom: 1px solid #4b441d;
  background: linear-gradient(90deg, #261f0f 0%, #1a1a17 70%);
  color: var(--text-2); font-size: 12px; line-height: 1.8;
}
.gate-banner b { color: var(--acid); letter-spacing: 1px; }
.gate-banner-act { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.gate-tip {
  margin-bottom: 12px; padding: 10px 14px; border-left: 4px solid var(--acid);
  background: #24200f; color: var(--text-2); font-size: 12px; line-height: 1.9;
}
.gate-tip b { color: var(--acid); }
.legend-gate {
  margin: 6px 10px 20px; padding: 30px 22px 26px; text-align: center;
  border: 1px dashed #5a5224; background:
    repeating-linear-gradient(-45deg, rgba(211,195,58,.025) 0 8px, transparent 8px 16px),
    radial-gradient(ellipse at 50% 0%, #222014 0%, #131315 68%);
  box-shadow: inset 0 0 60px rgba(0,0,0,.5);
}
.gate-kicker { font: 11px/1.7 Consolas, "Courier New", monospace; letter-spacing: 2px; color: var(--acid); }
.gate-mark {
  width: 74px; height: 74px; line-height: 70px; margin: 18px auto 12px;
  border: 3px solid var(--acid); border-radius: 50%; color: var(--acid);
  font: 900 34px/70px "SimHei", "Microsoft YaHei", sans-serif;
  box-shadow: 0 0 0 6px rgba(211,195,58,.08), 5px 5px 0 #000;
}
.legend-gate h2 {
  font: 900 clamp(20px, 3.4vw, 30px)/1.5 "SimHei", "Microsoft YaHei", sans-serif;
  letter-spacing: 2px; color: #ece9e2; margin: 6px 0 12px;
}
.gate-lead { color: var(--text-2); font-size: 13px; line-height: 2; }
.gate-lead b { color: var(--acid); }
.gate-steps { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 18px 0 20px; }
.gate-steps span {
  border: 1px solid var(--line); background: var(--panel-2); color: var(--dim);
  padding: 6px 12px; font: 11px/1.6 Consolas, monospace;
}
.gate-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.gate-actions .btn-hero { margin: 0; font-size: 13px; padding: 10px 18px; }
.gate-tips { color: var(--dim); font-size: 12px; line-height: 2; }
.gate-legal {
  margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line-soft);
  color: var(--muted); font-size: 11px; line-height: 1.9;
}
.gate-legal a { color: var(--acid); margin-left: 8px; }
.lg-lock {
  position: absolute; top: 6px; right: 6px; padding: 2px 6px;
  background: rgba(8,8,10,.86); border: 1px solid var(--acid); color: var(--acid);
  font: 10px/1.5 Consolas, monospace; letter-spacing: .5px;
}
@media (max-width: 620px) {
  .gate-banner { padding: 10px 12px; font-size: 12px; }
  .gate-banner-act { margin-left: 0; width: 100%; }
  .gate-banner-act .btn { flex: 1 1 0; text-align: center; }
  .legend-gate { margin: 4px 4px 14px; padding: 22px 12px 20px; }
  .gate-mark { width: 60px; height: 60px; line-height: 56px; font-size: 27px; margin: 12px auto 10px; }
  .gate-steps span { padding: 5px 8px; }
  .gate-actions .btn-hero { font-size: 12px; padding: 9px 12px; }
}
