:root {
  --x38: #1e3a8a;
  --w41: #fbbf24;
  --u90: #f0f9ff;
  --n55: #ffffff;
  --e13: #64748b;
  --p49: #e2e8f0;
  --p72: #ef4444;
  --y45: #22c55e;
  --f62: 4px;
  --w40: 8px;
  --w61: 12px;
  --e65: 4px;
  --d37: 8px;
  --d66: 16px;
  --f42: 24px;
  --q95: 32px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  background: var(--u90);
  color: var(--x38);
  line-height: 1.6;
  min-height: 100vh;
}

a { color: var(--x38); text-decoration: none; transition: color .2s; }
a:hover { color: var(--w41); }

.lq-item { max-width: 1200px; margin: 0 auto; padding: 0 var(--d66); }

/* Header */
.top-bar { background: var(--x38); color: #fff; padding: var(--d37) 0; font-size: 13px; }
.top-bar a { color: #93c5fd; }
.x5p3x5 { background: var(--n55); border-bottom: 3px solid var(--w41); padding: var(--d66) 0; }
.x5p3x5 h1 { font-size: 28px; color: var(--x38); }
.x5p3x5 .jm-flow { font-size: 14px; color: var(--e13); margin-top: var(--e65); }

/* Navigation */
._83ovm { background: var(--n55); border-radius: var(--w40); padding: var(--d66); margin: var(--d66) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
._83ovm .jm-body { display: flex; flex-wrap: wrap; gap: var(--d37); list-style: none; }
._83ovm .p8i6x4 { padding: var(--d37) var(--d66); background: var(--u90); border-radius: var(--f62); font-size: 14px; border: 1px solid var(--p49); }
._83ovm .p8i6x4:hover { border-color: var(--w41); background: #fffbeb; }

/* Post list */
.e5u8z2 { background: var(--n55); border-radius: var(--w40); overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
._tci67 { display: flex; align-items: center; padding: var(--d66); border-bottom: 1px solid var(--p49); gap: var(--d66); }
._tci67:last-child { border-bottom: none; }
._tci67:hover { background: var(--u90); }
.gk-flow { display: inline-block; padding: 2px 6px; border-radius: 3px; font-size: 12px; font-weight: 600; margin-right: var(--e65); }
._f2krp { background: var(--p72); color: #fff; }
._va2fx { background: var(--w41); color: var(--x38); }
._qpfzh { background: #dbeafe; color: var(--x38); }
.zt-pill { font-weight: 600; font-size: 15px; flex: 1; }
._u5oky { font-size: 12px; color: var(--e13); display: flex; gap: var(--d66); align-items: center; }

/* Avatar */
.sl-item { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; font-size: 14px; flex-shrink: 0; }

/* Sidebar */
.rp-cell { display: grid; grid-template-columns: 1fr 320px; gap: var(--f42); margin: var(--d66) 0; }
.r7f4a9 { background: var(--n55); border-radius: var(--w40); padding: var(--d66); margin-bottom: var(--d66); box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.r7f4a9 ._gktk2 { font-size: 16px; font-weight: 600; padding-bottom: var(--d37); border-bottom: 2px solid var(--w41); margin-bottom: var(--d66); }

/* User card */
.s2f5d5 { display: flex; align-items: center; gap: var(--d37); padding: var(--d37) 0; border-bottom: 1px solid var(--p49); }
.s2f5d5:last-child { border-bottom: none; }
.j5g6g9 { flex: 1; }
.j5g6g9 .mv-row { font-weight: 600; font-size: 14px; }
.j5g6g9 .rp-row { font-size: 12px; color: var(--e13); }
.mv-foot { font-size: 12px; color: var(--w41); font-weight: 600; }

/* Topic tags */
.xz-chip { display: inline-block; padding: var(--e65) var(--d37); background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 20px; font-size: 13px; margin: 3px; color: var(--x38); }
.xz-chip:hover { background: #dbeafe; }

/* Comments */
.d2y8a8 { background: var(--n55); border-radius: var(--w40); padding: var(--f42); margin: var(--d66) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.d2y8a8 .hp-card { font-size: 18px; font-weight: 600; margin-bottom: var(--d66); padding-bottom: var(--d37); border-bottom: 2px solid var(--w41); }
.cy-zone { display: flex; gap: var(--d66); padding: var(--d66) 0; border-bottom: 1px solid var(--p49); }
.cy-zone:last-child { border-bottom: none; }
._ujj4a { flex: 1; }
._ujj4a .fn-foot { font-weight: 600; font-size: 14px; }
._ujj4a .bw-tag { font-size: 12px; color: var(--e13); margin-left: var(--d37); }
._ujj4a .u3a1t7 { margin-top: var(--e65); font-size: 14px; line-height: 1.7; }
._ujj4a ._e2xt0 { margin-top: var(--d37); font-size: 12px; color: var(--e13); display: flex; gap: var(--d66); }

/* Online indicator */
.z3k9r3 { display: inline-block; width: 8px; height: 8px; background: var(--y45); border-radius: 50%; margin-right: 6px; animation: pulse-dot 1.5s infinite; }
@keyframes pulse-dot { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .5; transform: scale(1.4); } }

/* Marquee */
._ayo21 { background: var(--x38); color: #93c5fd; padding: 8px 0; overflow: hidden; position: relative; height: 32px; font-size: 13px; }
._ayo21 .mv-tag { position: absolute; white-space: nowrap; animation: scroll-left 30s linear infinite; }
@keyframes scroll-left { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/* Stats bar */
.u1q5i8 { background: var(--n55); padding: var(--d66); border-radius: var(--w40); text-align: center; font-size: 14px; color: var(--e13); margin: var(--d66) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.u1q5i8 span { margin: 0 var(--d66); }
.u1q5i8 strong { color: var(--x38); }

/* Post detail */
.h1a9t1 { background: var(--n55); border-radius: var(--w40); padding: var(--f42); margin: var(--d66) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
._ur10j { display: flex; gap: var(--f42); padding: var(--f42) 0; border-bottom: 1px solid var(--p49); }
._ur10j:last-child { border-bottom: none; }
.w8q3u8 { width: 140px; text-align: center; flex-shrink: 0; }
.w8q3u8 .sl-item { width: 56px; height: 56px; font-size: 20px; margin: 0 auto var(--d37); }
.w8q3u8 .y7x7m5 { font-weight: 600; font-size: 14px; }
.w8q3u8 ._1987v { font-size: 12px; color: var(--e13); margin-top: 2px; }
.a6a6d2 { flex: 1; }
.a6a6d2 .c9t7t2 { font-size: 12px; color: var(--e13); margin-bottom: var(--d37); }
.a6a6d2 ._t2eeq { font-size: 15px; line-height: 1.8; }
.a6a6d2 ._cnnrb { margin-top: var(--d66); display: flex; gap: var(--d66); font-size: 13px; color: var(--e13); }
.a6a6d2 .z6s7g9 { width: 100%; height: 200px; border-radius: var(--w40); margin: var(--d66) 0; }

/* Breadcrumb */
.tx-list { font-size: 13px; color: var(--e13); padding: var(--d66) 0; }
.tx-list a { color: var(--x38); }
.tx-list span { margin: 0 var(--e65); }

/* Pagination */
.jm-area { display: flex; gap: var(--e65); justify-content: center; padding: var(--d66) 0; }
.jm-area a, .jm-area span { padding: 6px 12px; border: 1px solid var(--p49); border-radius: var(--f62); font-size: 13px; }
.jm-area ._a3t3t { background: var(--x38); color: #fff; border-color: var(--x38); }

/* New post button */
._xt8hu { display: inline-block; padding: var(--d37) var(--f42); background: var(--w41); color: var(--x38); font-weight: 600; border-radius: var(--w40); font-size: 15px; border: none; cursor: pointer; }
._xt8hu:hover { background: #f59e0b; color: #fff; }

/* Footer */
.p1g8x6 { background: var(--x38); color: #93c5fd; padding: var(--q95) 0; margin-top: var(--q95); font-size: 13px; }
.p1g8x6 a { color: #bfdbfe; }
.p1g8x6 .p7u6q6 { display: flex; flex-wrap: wrap; gap: var(--d66); margin-bottom: var(--d66); }

/* Highlight badge */
.d5q2t4 { background: #fef3c7; color: #92400e; padding: 2px 6px; border-radius: 3px; font-size: 11px; }

/* Responsive */
@media (max-width: 1024px) {
  .rp-cell { grid-template-columns: 1fr 280px; }
}
@media (max-width: 768px) {
  .rp-cell { grid-template-columns: 1fr; }
  ._ur10j { flex-direction: column; }
  .w8q3u8 { width: 100%; display: flex; align-items: center; gap: var(--d37); text-align: left; }
  .w8q3u8 .sl-item { margin: 0; width: 40px; height: 40px; font-size: 16px; }
}
@media (max-width: 480px) {
  .lq-item { padding: 0 var(--d37); }
  ._tci67 { flex-direction: column; align-items: flex-start; }
  ._u5oky { flex-wrap: wrap; }
}