:root {
  --m42: #1e3a8a;
  --x45: #fbbf24;
  --u98: #f0f9ff;
  --v73: #ffffff;
  --f52: #64748b;
  --v89: #e2e8f0;
  --n2: #ef4444;
  --e47: #22c55e;
  --a83: 4px;
  --h2: 8px;
  --e34: 12px;
  --g20: 4px;
  --h8: 8px;
  --v16: 16px;
  --h53: 24px;
  --a1: 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(--u98);
  color: var(--m42);
  line-height: 1.6;
  min-height: 100vh;
}

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

.k7p6e2 { max-width: 1200px; margin: 0 auto; padding: 0 var(--v16); }

/* Header */
.top-bar { background: var(--m42); color: #fff; padding: var(--h8) 0; font-size: 13px; }
.top-bar a { color: #93c5fd; }
.b2e8s9 { background: var(--v73); border-bottom: 3px solid var(--x45); padding: var(--v16) 0; }
.b2e8s9 h1 { font-size: 28px; color: var(--m42); }
.b2e8s9 ._p5k74 { font-size: 14px; color: var(--f52); margin-top: var(--g20); }

/* Navigation */
.tx-pill { background: var(--v73); border-radius: var(--h2); padding: var(--v16); margin: var(--v16) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.tx-pill ._7o7r2 { display: flex; flex-wrap: wrap; gap: var(--h8); list-style: none; }
.tx-pill .r8m1t2 { padding: var(--h8) var(--v16); background: var(--u98); border-radius: var(--a83); font-size: 14px; border: 1px solid var(--v89); }
.tx-pill .r8m1t2:hover { border-color: var(--x45); background: #fffbeb; }

/* Post list */
._g9spq { background: var(--v73); border-radius: var(--h2); overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.bw-zone { display: flex; align-items: center; padding: var(--v16); border-bottom: 1px solid var(--v89); gap: var(--v16); }
.bw-zone:last-child { border-bottom: none; }
.bw-zone:hover { background: var(--u98); }
.lq-line { display: inline-block; padding: 2px 6px; border-radius: 3px; font-size: 12px; font-weight: 600; margin-right: var(--g20); }
._h6vj0 { background: var(--n2); color: #fff; }
.d8r9p5 { background: var(--x45); color: var(--m42); }
.bw-area { background: #dbeafe; color: var(--m42); }
.w6h5q4 { font-weight: 600; font-size: 15px; flex: 1; }
.fn-flow { font-size: 12px; color: var(--f52); display: flex; gap: var(--v16); align-items: center; }

/* Avatar */
.bw-chip { 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 */
._om9bh { display: grid; grid-template-columns: 1fr 320px; gap: var(--h53); margin: var(--v16) 0; }
._sddjc { background: var(--v73); border-radius: var(--h2); padding: var(--v16); margin-bottom: var(--v16); box-shadow: 0 1px 3px rgba(0,0,0,.06); }
._sddjc .fn-mark { font-size: 16px; font-weight: 600; padding-bottom: var(--h8); border-bottom: 2px solid var(--x45); margin-bottom: var(--v16); }

/* User card */
.h3y2d5 { display: flex; align-items: center; gap: var(--h8); padding: var(--h8) 0; border-bottom: 1px solid var(--v89); }
.h3y2d5:last-child { border-bottom: none; }
.p8i6l6 { flex: 1; }
.p8i6l6 .pn-row { font-weight: 600; font-size: 14px; }
.p8i6l6 .gk-zone { font-size: 12px; color: var(--f52); }
.hp-flow { font-size: 12px; color: var(--x45); font-weight: 600; }

/* Topic tags */
.jm-mark { display: inline-block; padding: var(--g20) var(--h8); background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 20px; font-size: 13px; margin: 3px; color: var(--m42); }
.jm-mark:hover { background: #dbeafe; }

/* Comments */
._87avn { background: var(--v73); border-radius: var(--h2); padding: var(--h53); margin: var(--v16) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
._87avn .jm-pan { font-size: 18px; font-weight: 600; margin-bottom: var(--v16); padding-bottom: var(--h8); border-bottom: 2px solid var(--x45); }
.l6n2d6 { display: flex; gap: var(--v16); padding: var(--v16) 0; border-bottom: 1px solid var(--v89); }
.l6n2d6:last-child { border-bottom: none; }
.e5c1x2 { flex: 1; }
.e5c1x2 .bw-item { font-weight: 600; font-size: 14px; }
.e5c1x2 .jm-item { font-size: 12px; color: var(--f52); margin-left: var(--h8); }
.e5c1x2 .wd-zone { margin-top: var(--g20); font-size: 14px; line-height: 1.7; }
.e5c1x2 .j6i4z3 { margin-top: var(--h8); font-size: 12px; color: var(--f52); display: flex; gap: var(--v16); }

/* Online indicator */
._ssmza { display: inline-block; width: 8px; height: 8px; background: var(--e47); 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 */
.pn-tag { background: var(--m42); color: #93c5fd; padding: 8px 0; overflow: hidden; position: relative; height: 32px; font-size: 13px; }
.pn-tag .c2b5z5 { position: absolute; white-space: nowrap; animation: scroll-left 30s linear infinite; }
@keyframes scroll-left { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/* Stats bar */
.pn-mark { background: var(--v73); padding: var(--v16); border-radius: var(--h2); text-align: center; font-size: 14px; color: var(--f52); margin: var(--v16) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.pn-mark span { margin: 0 var(--v16); }
.pn-mark strong { color: var(--m42); }

/* Post detail */
._21e9z { background: var(--v73); border-radius: var(--h2); padding: var(--h53); margin: var(--v16) 0; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.qr-item { display: flex; gap: var(--h53); padding: var(--h53) 0; border-bottom: 1px solid var(--v89); }
.qr-item:last-child { border-bottom: none; }
.i7c9c8 { width: 140px; text-align: center; flex-shrink: 0; }
.i7c9c8 .bw-chip { width: 56px; height: 56px; font-size: 20px; margin: 0 auto var(--h8); }
.i7c9c8 ._bz61d { font-weight: 600; font-size: 14px; }
.i7c9c8 ._czr6j { font-size: 12px; color: var(--f52); margin-top: 2px; }
._74ghz { flex: 1; }
._74ghz .wd-list { font-size: 12px; color: var(--f52); margin-bottom: var(--h8); }
._74ghz ._wuocl { font-size: 15px; line-height: 1.8; }
._74ghz ._9kvuj { margin-top: var(--v16); display: flex; gap: var(--v16); font-size: 13px; color: var(--f52); }
._74ghz .qr-wrap { width: 100%; height: 200px; border-radius: var(--h2); margin: var(--v16) 0; }

/* Breadcrumb */
.fn-zone { font-size: 13px; color: var(--f52); padding: var(--v16) 0; }
.fn-zone a { color: var(--m42); }
.fn-zone span { margin: 0 var(--g20); }

/* Pagination */
._8a48t { display: flex; gap: var(--g20); justify-content: center; padding: var(--v16) 0; }
._8a48t a, ._8a48t span { padding: 6px 12px; border: 1px solid var(--v89); border-radius: var(--a83); font-size: 13px; }
._8a48t .w4k9f9 { background: var(--m42); color: #fff; border-color: var(--m42); }

/* New post button */
.d3l8u3 { display: inline-block; padding: var(--h8) var(--h53); background: var(--x45); color: var(--m42); font-weight: 600; border-radius: var(--h2); font-size: 15px; border: none; cursor: pointer; }
.d3l8u3:hover { background: #f59e0b; color: #fff; }

/* Footer */
._4qrv9 { background: var(--m42); color: #93c5fd; padding: var(--a1) 0; margin-top: var(--a1); font-size: 13px; }
._4qrv9 a { color: #bfdbfe; }
._4qrv9 .u3l8w1 { display: flex; flex-wrap: wrap; gap: var(--v16); margin-bottom: var(--v16); }

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

/* Responsive */
@media (max-width: 1024px) {
  ._om9bh { grid-template-columns: 1fr 280px; }
}
@media (max-width: 768px) {
  ._om9bh { grid-template-columns: 1fr; }
  .qr-item { flex-direction: column; }
  .i7c9c8 { width: 100%; display: flex; align-items: center; gap: var(--h8); text-align: left; }
  .i7c9c8 .bw-chip { margin: 0; width: 40px; height: 40px; font-size: 16px; }
}
@media (max-width: 480px) {
  .k7p6e2 { padding: 0 var(--h8); }
  .bw-zone { flex-direction: column; align-items: flex-start; }
  .fn-flow { flex-wrap: wrap; }
}
