*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
    --page: #0a0a0a;
    --screen: #000000;
    --fg: #bcbcbc;
    --dim: #6f6f6f;
    --white: #f5f5f5;
    --green: #35d07f;
    --red: #ff5b5b;
    --cyan: #46c8e6;
    --yellow: #f2cd57;
    --magenta: #e06fb4;
    --line: #232323;
  }
  html { scroll-behavior: smooth; }
  body { background: var(--page); color: var(--fg); font-family: 'JetBrains Mono', 'Noto Sans TC', monospace; line-height: 1.8; font-size: 15px; -webkit-font-smoothing: antialiased; }
  a { color: var(--cyan); text-decoration: none; }
  a:hover { text-decoration: underline; }
  ::selection { background: #2a4d3a; }

  .cyan { color: var(--cyan); } .green { color: var(--green); } .red { color: var(--red); }
  .yellow { color: var(--yellow); } .white { color: var(--white); } .dim { color: var(--dim); } .mag { color: var(--magenta); }

  /* top bar */
  .topbar { position: sticky; top: 0; z-index: 50; background: #001f26; color: var(--cyan); border-bottom: 1px solid #013b47; padding: 0.4rem 1rem; display: flex; justify-content: space-between; align-items: center; font-size: 0.82rem; }
  .topbar .l { display: flex; align-items: center; gap: 0.5rem; }
  .topbar img { width: 20px; height: 20px; border-radius: 4px; }
  .topbar a.reg { background: var(--green); color: #04210f; padding: 0.2rem 0.7rem; border-radius: 2px; font-weight: 700; }
  .topbar a.reg:hover { text-decoration: none; filter: brightness(1.1); }

  /* screen */
  .screen { max-width: 1000px; margin: 0 auto; background: var(--screen); min-height: 100vh; padding: 1.5rem clamp(1rem, 3vw, 2.25rem) 0; position: relative; box-shadow: 0 0 80px rgba(53,208,127,0.04); }
  .screen::after { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 60; background: repeating-linear-gradient(to bottom, rgba(255,255,255,0.015) 0 1px, transparent 1px 3px); }

  /* article header */
  .hdr { border: 1px solid var(--line); border-radius: 3px; padding: 0.7rem 1rem; margin-bottom: 1.25rem; font-size: 0.92rem; background: #050505; }
  .hdr .row { display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; }
  .hdr .k { color: var(--cyan); }
  .hdr .board { margin-left: auto; }
  .sep { color: var(--dim); white-space: nowrap; overflow: hidden; margin: 1.25rem 0; user-select: none; }
  .sep::before { content: '──────────────────────────────────────────────────────────────────────────────────────'; }

  /* article body */
  .art { font-size: 0.98rem; }
  .art h1 { font-size: clamp(1.3rem, 3.6vw, 1.9rem); font-weight: 700; color: var(--white); line-height: 1.4; margin: 0.4rem 0 1.4rem; }
  .art h1 .tag { color: var(--yellow); }
  .art h1 .blink { color: var(--green); animation: blink 1.1s steps(1) infinite; }
  @keyframes blink { 50% { opacity: 0; } }
  .art p { margin-bottom: 1rem; }
  .art .greet { color: var(--white); }
  .art ul { list-style: none; margin: 0 0 1rem; }
  .art li { padding: 0.15rem 0; }
  .art li::before { content: '* '; color: var(--green); }
  .art li b { color: var(--white); font-weight: 500; }
  .art .rule { color: var(--yellow); }
  .art .sig { color: var(--dim); font-size: 0.88rem; line-height: 1.9; }
  .art .sig .nick { color: var(--green); }

  .cta-inline { display: inline-block; background: var(--green); color: #04210f; font-weight: 700; padding: 0.55rem 1.4rem; border-radius: 3px; margin: 0.5rem 0 0.25rem; }
  .cta-inline:hover { text-decoration: none; filter: brightness(1.1); }

  /* push list */
  .pushes-label { color: var(--dim); font-size: 0.85rem; margin-bottom: 0.5rem; }
  .push { display: flex; gap: 0.6rem; padding: 0.22rem 0; font-size: 0.92rem; align-items: baseline; flex-wrap: wrap; }
  .push .mk { width: 1.6rem; flex-shrink: 0; font-weight: 700; }
  .push.up .mk { color: var(--green); } .push.down .mk { color: var(--red); } .push.arrow .mk { color: var(--dim); }
  .push .uid { color: var(--cyan); flex-shrink: 0; }
  .push .txt { color: var(--fg); flex: 1; min-width: 200px; }
  .push .txt b { color: var(--white); font-weight: 500; }
  .push .t { color: var(--dim); font-size: 0.78rem; margin-left: auto; }

  /* info boxes */
  .box { border: 1px solid var(--line); border-radius: 3px; padding: 1rem 1.2rem; margin: 1.25rem 0; background: #050505; }
  .box .bt { color: var(--yellow); margin-bottom: 0.7rem; }
  .box .bt::before { content: '[ '; color: var(--dim); } .box .bt::after { content: ' ]'; color: var(--dim); }
  .link-row { display: flex; flex-wrap: wrap; gap: 0.3rem 1rem; padding: 0.2rem 0; }
  .link-row .nm { color: var(--white); min-width: 230px; }
  .link-row .nm::before { content: '> '; color: var(--green); }
  .link-row .u { color: var(--cyan); word-break: break-all; }
  .link-row .note { color: var(--dim); }

  /* author card */
  .author { display: flex; gap: 1.2rem; align-items: center; }
  .author img { width: 84px; height: 84px; border-radius: 50%; flex-shrink: 0; border: 1px solid var(--line); }
  .author .id { color: var(--green); }
  .author .meta { color: var(--fg); font-size: 0.9rem; }
  .author a { color: var(--cyan); }

  /* powered */
  .powered { display: inline-flex; align-items: center; gap: 0.7rem; padding: 0.55rem 1.1rem; border: 1px solid var(--line); border-radius: 3px; margin-top: 0.5rem; }
  .powered span { color: var(--dim); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; }
  .powered img { height: 20px; display: block; }

  /* status bar CTA */
  .statusbar { position: sticky; bottom: 0; z-index: 55; margin: 2rem clamp(-1rem,-3vw,-2.25rem) 0; background: #18a0a8; color: #002b2e; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; padding: 0.55rem 1.25rem; font-size: 0.86rem; font-weight: 500; }
  .statusbar a { background: #002b2e; color: #7fe9f0; padding: 0.25rem 0.8rem; border-radius: 2px; font-weight: 700; }
  .statusbar a:hover { text-decoration: none; filter: brightness(1.15); }
  .statusbar .pos { margin-left: auto; color: #013b40; }

  footer { max-width: 1000px; margin: 0 auto; padding: 1.5rem clamp(1rem,3vw,2.25rem) 2.5rem; color: var(--dim); font-size: 0.82rem; background: var(--screen); }
  footer a { color: var(--cyan); }
  .foot-nav { display: flex; flex-wrap: wrap; gap: 0.4rem 1.25rem; margin-bottom: 0.6rem; }