/* ==========================================================================
   BAIYE-149 · 白叶子页面「现代像素混搭」共享设计层
   - 只覆盖外观，不改业务逻辑 / DOM id / API
   - 共享：字体、像素变量、按钮、卡片、弹窗、表单、滚动条、状态
   - 分页主题：
       .wl-sp-bugs     红石维修终端（红石红）
       .wl-sp-mem      胶片档案馆（琥珀）
       .wl-sp-user     居民身份档案（天空蓝 + 草方块）
       .wl-sp-hb       附魔书知识库（附魔紫）
   - 像素字体仅用 12 的整数倍字号
   ========================================================================== */
@font-face {
  font-family: "WhiteLeaf Pixel";
  src: url("/assets/fonts/whiteleaf-pixel-12-149.woff2?v=149") format("woff2");
  font-display: swap;
}

:root {
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Microsoft YaHei UI", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --font-pixel: "WhiteLeaf Pixel", var(--font-body);
  --font-mono: "Cascadia Mono", "JetBrains Mono", Consolas, ui-monospace, "SF Mono", monospace;
}

/* ---------- 主题变量（挂在 body 上，覆盖页面内联变量） ---------- */
html[data-theme="light"] body.wl-sp {
  --px-bg: #f3f6f1; --px-bg-2: #e9efe6; --px-surface: #ffffff; --px-surface-2: #f6f9f4;
  --px-ink: #1f2b22; --px-ink-2: #536253; --px-ink-3: #879585;
  --px-line: #24321f; --px-line-soft: rgba(36, 50, 31, .14); --px-line-mid: rgba(36, 50, 31, .28);
  --px-grid: rgba(36, 50, 31, .045); --px-hard: rgba(36, 50, 31, .2);
  --px-accent: #4f8a3c; --px-sky: #2f7fc1; --px-amber: #c7821b; --px-red: #c0392b; --px-violet: #6b4fc4;
  --px-leaf-soft: #e6f1df;
  --sp-accent: #4f8a3c; --sp-accent-hi: #63a24c; --sp-accent-ink: #ffffff; --sp-accent-soft: rgba(79, 138, 60, .12);
}
html[data-theme="dark"] body.wl-sp {
  --px-bg: #0d1916; --px-bg-2: #12221e; --px-surface: #15241f; --px-surface-2: #1a2c26;
  --px-ink: #e9efe2; --px-ink-2: #a9b8a6; --px-ink-3: #6f8270;
  --px-line: #03080a; --px-line-soft: rgba(233, 239, 226, .1); --px-line-mid: rgba(233, 239, 226, .2);
  --px-grid: rgba(233, 239, 226, .028); --px-hard: rgba(0, 0, 0, .55);
  --px-accent: #8fd06a; --px-sky: #6cc4ff; --px-amber: #f2b84b; --px-red: #ff6b5a; --px-violet: #b49cff;
  --px-leaf-soft: rgba(143, 208, 106, .12);
  --sp-accent: #8fd06a; --sp-accent-hi: #a6e07f; --sp-accent-ink: #0b1a12; --sp-accent-soft: rgba(143, 208, 106, .12);
}
/* 分页强调色 */
html[data-theme="light"] body.wl-sp-bugs { --sp-accent: #c0392b; --sp-accent-hi: #d9493a; --sp-accent-ink: #fff; --sp-accent-soft: rgba(192, 57, 43, .1); }
html[data-theme="dark"]  body.wl-sp-bugs { --sp-accent: #ff6b5a; --sp-accent-hi: #ff8676; --sp-accent-ink: #1a0705; --sp-accent-soft: rgba(255, 107, 90, .12); }
html[data-theme="light"] body.wl-sp-mem  { --sp-accent: #b86e12; --sp-accent-hi: #cf8020; --sp-accent-ink: #fff; --sp-accent-soft: rgba(184, 110, 18, .11); }
html[data-theme="dark"]  body.wl-sp-mem  { --sp-accent: #f2b84b; --sp-accent-hi: #ffc861; --sp-accent-ink: #1d1406; --sp-accent-soft: rgba(242, 184, 75, .12); }
html[data-theme="light"] body.wl-sp-user { --sp-accent: #2f7fc1; --sp-accent-hi: #3b8fd4; --sp-accent-ink: #fff; --sp-accent-soft: rgba(47, 127, 193, .1); }
html[data-theme="dark"]  body.wl-sp-user { --sp-accent: #6cc4ff; --sp-accent-hi: #8fd3ff; --sp-accent-ink: #04121d; --sp-accent-soft: rgba(108, 196, 255, .12); }
html[data-theme="light"] body.wl-sp-hb   { --sp-accent: #6b4fc4; --sp-accent-hi: #7d61d6; --sp-accent-ink: #fff; --sp-accent-soft: rgba(107, 79, 196, .1); }
html[data-theme="dark"]  body.wl-sp-hb   { --sp-accent: #b49cff; --sp-accent-hi: #c7b4ff; --sp-accent-ink: #160f2b; --sp-accent-soft: rgba(180, 156, 255, .12); }

/* 把各页面原有变量映射到像素体系 */
body.wl-sp {
  --bg: var(--px-bg); --surface: var(--px-surface); --surface-solid: var(--px-surface); --surface-2: var(--px-surface-2);
  --border: var(--px-line-mid); --border-subtle: var(--px-line-soft);
  --text: var(--px-ink); --text-muted: var(--px-ink-2);
  --accent: var(--sp-accent); --accent-strong: var(--sp-accent-hi); --accent-soft: var(--sp-accent-soft); --accent-glow: transparent;
  --warn: var(--px-amber); --ok: var(--px-accent); --bad: var(--px-red); --violet: var(--px-violet);
  --glass-shadow: 6px 6px 0 0 var(--px-hard);
  --bg-card: var(--px-surface); --border-glass: var(--px-line-soft); --text-main: var(--px-ink); --accent-blue: var(--sp-accent);
  --bg-base: var(--px-bg); --bg-surface: var(--px-surface); --glass-surface: var(--px-surface); --glass-border: var(--px-line-soft);
  --card-shadow: none; --scrollbar-thumb: var(--px-line-mid); --scrollbar-thumb-hover: var(--sp-accent);
  --font-sans: var(--font-body); --font-serif: var(--font-body);
  background-color: var(--px-bg) !important;
  background-image:
    linear-gradient(var(--px-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--px-grid) 1px, transparent 1px) !important;
  background-size: 24px 24px !important;
  color: var(--px-ink);
  font-family: var(--font-body);
  overflow-x: hidden;
}
body.wl-sp ::selection { background: var(--sp-accent); color: var(--sp-accent-ink); }
body.wl-sp .ambient, body.wl-sp .ambient-glow, body.wl-sp .ambient-bg { display: none !important; }

/* 滚动条：方块 */
body.wl-sp * { scrollbar-color: var(--px-line-mid) transparent; }
body.wl-sp ::-webkit-scrollbar { width: 10px; height: 10px; }
body.wl-sp ::-webkit-scrollbar-thumb { background: var(--px-line-mid) !important; border-radius: 0 !important; border: 2px solid transparent; background-clip: padding-box !important; }
body.wl-sp ::-webkit-scrollbar-thumb:hover { background: var(--sp-accent) !important; background-clip: padding-box !important; }

/* ---------- 像素字体工具 ---------- */
.sp-pixel, body.wl-sp .kicker, body.wl-sp .hero-kicker, body.wl-sp .leaf-kicker,
body.wl-sp .sidebar-group-title, body.wl-sp .toc-title, body.wl-sp .pagination-label {
  font-family: var(--font-pixel) !important;
  font-weight: 400 !important;
  -webkit-font-smoothing: none;
}
body.wl-sp .kicker, body.wl-sp .hero-kicker, body.wl-sp .leaf-kicker {
  font-size: 12px !important; letter-spacing: .12em !important; color: var(--sp-accent) !important;
  display: inline-flex; align-items: center; gap: 10px;
}
body.wl-sp .kicker::before, body.wl-sp .hero-kicker::before, body.wl-sp .leaf-kicker::before {
  content: ""; width: 6px; height: 6px; background: currentColor; box-shadow: 9px 0 0 currentColor; margin-right: 9px;
}

/* 代码像素图标容器 */
body.wl-sp .px-ico { display: inline-block; line-height: 0; vertical-align: -3px; flex: none; }
body.wl-sp .px-ico svg { width: 100%; height: 100%; display: block; shape-rendering: crispEdges; }
body.wl-sp [data-px] { width: 20px; height: 20px; }
body.wl-sp .sp-ico-lg[data-px] { width: 32px; height: 32px; }
body.wl-sp .sp-ico-xl[data-px] { width: 48px; height: 48px; }

/* ---------- 顶栏 ---------- */
body.wl-sp .hdr, body.wl-sp .archive-header, body.wl-sp .wiki-header {
  background: color-mix(in srgb, var(--px-bg) 94%, transparent) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  border-bottom: 3px solid var(--px-line) !important;
  box-shadow: 0 3px 0 0 var(--px-line-soft) !important;
}
body.wl-sp .user-header { border-bottom: 2px dashed var(--px-line-soft); }
body.wl-sp .brand b, body.wl-sp .archive-header .brand-title, body.wl-sp .user-header .brand-title, body.wl-sp .wiki-brand-link {
  font-family: var(--font-pixel) !important; font-size: 24px !important; font-weight: 400 !important;
  letter-spacing: 0 !important; -webkit-font-smoothing: none; line-height: 1.1; white-space: nowrap;
}
body.wl-sp .brand img, body.wl-sp .brand-logo { filter: drop-shadow(3px 3px 0 var(--px-hard)) !important; }
body.wl-sp .brand small, body.wl-sp .brand-subtitle {
  font-family: var(--font-pixel) !important; font-size: 12px !important; letter-spacing: .1em !important;
  color: var(--sp-accent) !important; border-left: 3px solid var(--px-line-soft) !important;
}

/* ---------- 像素按钮（缺角描边 + 底部厚度） ---------- */
body.wl-sp :is(.btn, .btn-action, .btn-glass, .wiki-back-btn, .theme-toggle-btn, .mobile-menu-btn, .btn-brand-submit, .lightbox-dl-btn, .empty-base-cta) {
  --bl: var(--px-line); --bf: var(--px-surface); --bt: var(--px-ink);
  border: 0 !important; border-radius: 0 !important;
  background: var(--bf) !important; color: var(--bt) !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  margin: 3px;
  box-shadow:
    0 -3px 0 0 var(--bl), 0 3px 0 0 var(--bl), -3px 0 0 0 var(--bl), 3px 0 0 0 var(--bl),
    inset 0 -3px 0 0 rgba(0, 0, 0, .16), inset 0 2px 0 0 rgba(255, 255, 255, .18) !important;
  transition: transform .12s ease, filter .15s ease !important;
  font-weight: 700 !important;
}
body.wl-sp :is(.btn, .btn-action, .btn-glass, .wiki-back-btn, .theme-toggle-btn, .mobile-menu-btn, .btn-brand-submit, .lightbox-dl-btn, .empty-base-cta):hover:not([disabled]) {
  transform: translateY(-2px) !important; filter: brightness(1.05); border-color: transparent !important;
}
body.wl-sp :is(.btn, .btn-action, .btn-glass, .wiki-back-btn, .theme-toggle-btn, .mobile-menu-btn, .btn-brand-submit, .lightbox-dl-btn, .empty-base-cta):active:not([disabled]) {
  transform: translateY(2px) !important;
  box-shadow: 0 -3px 0 0 var(--bl), 0 3px 0 0 var(--bl), -3px 0 0 0 var(--bl), 3px 0 0 0 var(--bl), inset 0 3px 0 0 rgba(0, 0, 0, .18) !important;
}
body.wl-sp :is(.btn, .btn-action, .btn-glass, .btn-brand-submit, .theme-toggle-btn):focus-visible { outline: 3px dashed var(--px-sky) !important; outline-offset: 5px; }
body.wl-sp :is(.btn-primary, #btnOpenUploadModal, #btnSubmitUpload, .btn-brand-submit, #btnOpenEditBase, .lightbox-dl-btn) {
  --bf: var(--sp-accent); --bt: var(--sp-accent-ink);
}
body.wl-sp :is(.btn-primary, #btnOpenUploadModal, #btnSubmitUpload, .btn-brand-submit, #btnOpenEditBase) * { color: inherit !important; }
body.wl-sp .theme-toggle-btn:hover { transform: translateY(-2px) !important; }
body.wl-sp .btn[disabled], body.wl-sp .btn-glass:disabled, body.wl-sp .btn-brand-submit:disabled { opacity: .5; filter: grayscale(.4); }

/* 小按钮：2px 描边方块 */
body.wl-sp :is(.bbtn, .order-btn, .blike, .bmap, .btn-map-fly, .btn-pill-logout, .x, .btn-dialog-circle-close, .lightbox-close, .lightbox-nav, .blb-btn, .blb-close) {
  border-radius: 0 !important;
  border: 2px solid var(--px-line-mid) !important;
  box-shadow: 2px 2px 0 0 var(--px-hard) !important;
  backdrop-filter: none !important;
  transition: transform .12s ease, background-color .15s, color .15s !important;
}
body.wl-sp :is(.bbtn, .order-btn, .blike, .bmap, .btn-map-fly, .x, .btn-dialog-circle-close):hover:not(:disabled) {
  transform: translate(-1px, -1px); border-color: var(--sp-accent) !important; color: var(--sp-accent) !important;
}
body.wl-sp .order-btn.primary { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; border-color: var(--px-line) !important; }

/* ---------- 弹窗（像素窗口） ---------- */
body.wl-sp dialog::backdrop { background: rgba(4, 10, 8, .62) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
body.wl-sp :is(.sheet, .upload-dialog-inner, dialog.edit-base-dialog, #cardExportDialog) {
  border-radius: 0 !important;
  border: 3px solid var(--px-line) !important;
  border-top: 9px solid var(--sp-accent) !important;
  background: var(--px-surface) !important;
  box-shadow: 8px 8px 0 0 var(--px-hard) !important;
}
body.wl-sp .upload-dialog { border-radius: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
body.wl-sp dialog[open] .sheet { animation: spPop .28s steps(5) both !important; }
@keyframes spPop { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
body.wl-sp .sheet-h h2, body.wl-sp #editBaseTitle, body.wl-sp #leafStudioTitle, body.wl-sp #cardExportTitle, body.wl-sp .upload-header h3 {
  font-family: var(--font-pixel) !important; font-size: 24px !important; font-weight: 400 !important; letter-spacing: 0 !important;
  -webkit-font-smoothing: none; line-height: 1.25 !important;
}
body.wl-sp .upload-header, body.wl-sp .card-export-head { background: var(--px-surface-2) !important; border-bottom: 3px solid var(--px-line-soft) !important; }

/* ---------- 表单 ---------- */
body.wl-sp :is(.inp, .upload-input, .upload-select, .upload-textarea, #inBaseName, #inBaseWorld) {
  border-radius: 0 !important;
  border: 2px solid var(--px-line-mid) !important;
  background: var(--px-surface-2) !important;
  color: var(--px-ink) !important;
  box-shadow: inset 3px 3px 0 0 rgba(0, 0, 0, .06) !important;
  transition: border-color .15s, box-shadow .15s !important;
}
body.wl-sp :is(.inp, .upload-input, .upload-select, .upload-textarea, #inBaseName, #inBaseWorld):focus {
  border-color: var(--sp-accent) !important; outline: none !important;
  box-shadow: 0 0 0 3px var(--sp-accent-soft), inset 3px 3px 0 0 rgba(0, 0, 0, .06) !important;
}
body.wl-sp select option { background: var(--px-surface); color: var(--px-ink); }
body.wl-sp .coord-field-capsule { border-radius: 0 !important; border: 2px solid var(--px-line-mid) !important; background: var(--px-surface-2) !important; }
body.wl-sp .coord-field-capsule:focus-within { border-color: var(--sp-accent) !important; box-shadow: 0 0 0 3px var(--sp-accent-soft) !important; }
body.wl-sp .coord-prefix-badge { border-radius: 0 !important; font-family: var(--font-pixel); font-size: 12px !important; }
body.wl-sp .coord-input-inner { font-family: var(--font-mono) !important; }

/* ---------- 通用状态 ---------- */
body.wl-sp .skel, body.wl-sp .sp-skel {
  border-radius: 0 !important;
  background: var(--px-surface) !important;
  border: 2px solid var(--px-line-soft);
  position: relative; overflow: hidden;
  animation: none !important;
}
body.wl-sp .skel::after, body.wl-sp .sp-skel::after {
  content: ""; position: absolute; inset: 0; width: 30%;
  background: repeating-linear-gradient(90deg, var(--sp-accent-soft) 0 6px, transparent 6px 12px);
  animation: spScan 1.4s steps(14) infinite;
}
@keyframes spScan { from { transform: translateX(-100%); } to { transform: translateX(340%); } }
body.wl-sp .sp-cursor { display: inline-block; width: .6em; height: 1em; background: currentColor; vertical-align: -2px; animation: spBlink 1s steps(1) infinite; }
@keyframes spBlink { 50% { opacity: 0; } }

/* 终端面板（共享组件）；BAIYE-151 起随深浅主题切换配色 */
body.wl-sp, html[data-theme="dark"] body.wl-sp { --term-bg: #0b1310; --term-ink: #b9f59a; --term-scan: rgba(255,255,255,.03); --term-bar: #16231d; --term-bar-line: #03080a; --term-title: #e9efe2; --term-k: #6cc4ff; --term-w: #f2b84b; --term-r: #ff6b5a; --term-ok: #8fd06a; --term-dim: #5d7266; --term-track: #22332b; }
html[data-theme="light"] body.wl-sp { --term-bg: #f7f9f2; --term-ink: #2a5a1f; --term-scan: rgba(20,40,20,.035); --term-bar: #e4ebdc; --term-bar-line: var(--px-line); --term-title: #1f2a22; --term-k: #1b6fb5; --term-w: #a8610a; --term-r: #c0392b; --term-ok: #2f8a2a; --term-dim: #7b8a7e; --term-track: #d3dccb; }
.sp-term {
  position: relative;
  background: var(--term-bg); color: var(--term-ink);
  border: 3px solid var(--px-line);
  box-shadow: 6px 6px 0 0 var(--px-hard);
  font-family: var(--font-mono); font-size: 13px; line-height: 1.9;
  padding: 0 0 14px; text-align: left; overflow: hidden;
}
.sp-term::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, var(--term-scan) 0 2px, transparent 2px 4px);
}
.sp-term-bar {
  display: flex; align-items: center; gap: 8px; padding: 6px 12px; margin-bottom: 10px;
  background: var(--term-bar); border-bottom: 3px solid var(--term-bar-line); color: var(--term-title);
  font-family: var(--font-pixel); font-size: 12px; letter-spacing: .08em; -webkit-font-smoothing: none;
}
.sp-term-bar i { width: 9px; height: 9px; background: #ff6b5a; flex: none; }
.sp-term-bar i:nth-child(2) { background: #f2b84b; }
.sp-term-bar i:nth-child(3) { background: #8fd06a; }
.sp-term-bar b { margin-left: auto; font-weight: 400; color: var(--term-ok); }
.sp-term-line { padding: 0 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-term-line .k { color: var(--term-k); }
.sp-term-line .w { color: var(--term-w); }
.sp-term-line .r { color: var(--term-r); }
.sp-term-line .ok { color: var(--term-ok); }
.sp-term-line .dim { color: var(--term-dim); }
.sp-bar { display: inline-block; width: 120px; height: 10px; vertical-align: -1px; background: repeating-linear-gradient(90deg, var(--term-track) 0 9px, transparent 9px 12px); position: relative; }
.sp-bar::before { content: ""; position: absolute; inset: 0; width: calc(var(--p, 0) * 1%); background: repeating-linear-gradient(90deg, var(--term-ok) 0 9px, transparent 9px 12px); transition: width .8s steps(10); }

/* ==========================================================================
   A · 问题反馈：红石维修终端
   ========================================================================== */
body.wl-sp-bugs .hero {
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 36px; align-items: center;
  text-align: left; padding: 56px 0 36px;
}
body.wl-sp-bugs .hero h1 {
  font-family: var(--font-pixel) !important; font-size: 60px !important; font-weight: 400 !important; letter-spacing: 0 !important;
  -webkit-font-smoothing: none; line-height: 1.1; margin: 14px 0 16px;
  text-shadow: 4px 4px 0 var(--sp-accent-soft);
}
body.wl-sp-bugs .hero p { margin: 0; max-width: 540px; }
body.wl-sp-bugs .hero-cta { justify-content: flex-start; }
.sp-hero-icons { display: flex; gap: 10px; margin-bottom: 16px; }
.sp-hero-icons [data-px] { width: 36px !important; height: 36px !important; padding: 4px; background: var(--px-surface); border: 2px solid var(--px-line-mid); box-shadow: 3px 3px 0 0 var(--px-hard); }
.sp-hero-icons [data-px]:nth-child(2) { animation: spBob 2.4s steps(4) infinite; }
@keyframes spBob { 50% { transform: translateY(-4px); } }

body.wl-sp-bugs .stats { gap: 16px; }
body.wl-sp-bugs .stat {
  position: relative; border-radius: 0 !important; backdrop-filter: none !important;
  background: var(--px-surface) !important; border: 3px solid var(--px-line) !important; border-left-width: 9px !important;
  box-shadow: 5px 5px 0 0 var(--px-hard); padding: 16px 18px 14px !important;
}
body.wl-sp-bugs .stat:nth-child(1) { border-left-color: var(--px-sky) !important; }
body.wl-sp-bugs .stat:nth-child(2) { border-left-color: var(--px-accent) !important; }
body.wl-sp-bugs .stat:nth-child(3) { border-left-color: var(--px-violet) !important; }
body.wl-sp-bugs .stat:nth-child(4) { border-left-color: var(--px-amber) !important; }
body.wl-sp-bugs .stat [data-px] { position: absolute; top: 12px; right: 12px; width: 28px !important; height: 28px !important; }
body.wl-sp-bugs .stat .n { font-family: var(--font-pixel); font-size: 36px !important; font-weight: 400 !important; letter-spacing: 0 !important; line-height: 1.15; -webkit-font-smoothing: none; }
body.wl-sp-bugs .stat .l { font-size: 12.5px; }

body.wl-sp-bugs .rule {
  border-radius: 0 !important; background: var(--px-surface-2) !important;
  border: 2px dashed var(--px-line-mid) !important; position: relative; padding-top: 20px !important;
}
body.wl-sp-bugs .rule h3 { font-family: var(--font-pixel); font-weight: 400 !important; font-size: 24px !important; -webkit-font-smoothing: none; gap: 10px !important; margin-bottom: 10px !important; }
body.wl-sp-bugs .rule h3 [data-px] { width: 28px; height: 28px; }
body.wl-sp-bugs .rule:nth-child(2) { border-color: color-mix(in srgb, var(--px-violet) 55%, transparent) !important; }

body.wl-sp-bugs .rank-h h2 { font-family: var(--font-pixel); font-weight: 400 !important; font-size: 24px !important; -webkit-font-smoothing: none; display: flex; gap: 10px; align-items: center; }
body.wl-sp-bugs .rank-h h2 [data-px] { width: 28px; height: 28px; }
body.wl-sp-bugs .rank-row {
  border-radius: 0 !important; background: var(--px-surface) !important;
  border: 2px solid var(--px-line-mid) !important; box-shadow: 3px 3px 0 0 var(--px-hard);
}
body.wl-sp-bugs .rank-row:hover { transform: translate(-2px, -2px) !important; box-shadow: 5px 5px 0 0 var(--px-hard); border-color: var(--sp-accent) !important; }
body.wl-sp-bugs .rank-row.top { border-color: var(--px-amber) !important; background: linear-gradient(90deg, color-mix(in srgb, var(--px-amber) 12%, transparent), transparent 70%), var(--px-surface) !important; }
body.wl-sp-bugs .rank-no { border-radius: 0 !important; font-family: var(--font-pixel); font-weight: 400 !important; font-size: 12px !important; border: 2px solid var(--px-line-soft); }
body.wl-sp-bugs .rank-row.top .rank-no { border: 0; font-size: 20px !important; }
body.wl-sp-bugs .rank-num b { font-family: var(--font-pixel); font-weight: 400; font-size: 24px !important; -webkit-font-smoothing: none; }
body.wl-sp-bugs .rank-empty, body.wl-sp-bugs .empty { border-radius: 0 !important; border: 3px dashed var(--px-line-mid) !important; background: repeating-linear-gradient(45deg, transparent 0 10px, var(--sp-accent-soft) 10px 12px); }

body.wl-sp-bugs .seg { border-radius: 0 !important; border: 3px solid var(--px-line) !important; background: var(--px-surface) !important; padding: 3px !important; box-shadow: 4px 4px 0 0 var(--px-hard); }
body.wl-sp-bugs .seg button { border-radius: 0 !important; font-weight: 700 !important; }
body.wl-sp-bugs .seg button.on { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .2) !important; }

/* 工单卡 */
body.wl-sp-bugs .card {
  border-radius: 0 !important; backdrop-filter: none !important;
  background: var(--px-surface) !important;
  border: 2px solid var(--px-line-mid) !important; border-left: 8px solid var(--px-ink-3) !important;
  box-shadow: 4px 4px 0 0 var(--px-hard);
  animation: spIn .35s steps(5) both;
}
body.wl-sp-bugs .card:hover { transform: translate(-2px, -2px) !important; box-shadow: 6px 6px 0 0 var(--px-hard) !important; border-color: var(--sp-accent) !important; }
body.wl-sp-bugs .card:has(.st-confirmed) { border-left-color: var(--px-sky) !important; }
body.wl-sp-bugs .card:has(.st-fixed) { border-left-color: var(--px-accent) !important; }
body.wl-sp-bugs .card:has(.st-rejected), body.wl-sp-bugs .card:has(.st-duplicate) { border-left-color: var(--px-red) !important; }
body.wl-sp-bugs .card.exploit { border-left-color: var(--px-violet) !important; background: repeating-linear-gradient(135deg, transparent 0 14px, color-mix(in srgb, var(--px-violet) 7%, transparent) 14px 16px), var(--px-surface) !important; }
body.wl-sp-bugs .card .ico { border-radius: 0 !important; border: 2px solid var(--px-line-soft); background: var(--px-surface-2) !important; }
body.wl-sp-bugs .card .meta span:first-child { font-family: var(--font-mono); color: var(--sp-accent); font-weight: 700; }
body.wl-sp-bugs .side { border-left: 2px dashed var(--px-line-soft); padding-left: 14px; align-self: stretch; justify-content: center; }
body.wl-sp-bugs .pill { border-radius: 0 !important; font-family: var(--font-pixel); font-weight: 400 !important; font-size: 12px !important; -webkit-font-smoothing: none; border-width: 2px !important; padding: 3px 8px !important; }
body.wl-sp-bugs .coin { font-family: var(--font-mono); }
body.wl-sp-bugs .reply { border-radius: 0 !important; border-left-width: 4px !important; background: var(--px-surface-2) !important; }
body.wl-sp-bugs .cats span { border-radius: 0 !important; border: 2px solid var(--px-line-mid) !important; }
body.wl-sp-bugs .cats input:checked + span { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; border-color: var(--px-line) !important; box-shadow: 2px 2px 0 0 var(--px-hard) !important; }
body.wl-sp-bugs .shot, body.wl-sp-bugs .shot-add { border-radius: 0 !important; }
body.wl-sp-bugs .shot-add { border: 2px dashed var(--px-line-mid) !important; }
body.wl-sp-bugs .shot button { border-radius: 0 !important; }
body.wl-sp-bugs .xbox { border-radius: 0 !important; border: 2px dashed color-mix(in srgb, var(--px-violet) 55%, transparent) !important; }
body.wl-sp-bugs .sec h4 { font-family: var(--font-pixel); font-weight: 400 !important; font-size: 12px !important; color: var(--sp-accent) !important; }
body.wl-sp-bugs .sec .txt { border-radius: 0 !important; font-family: var(--font-mono); font-size: 13px !important; border: 2px solid var(--px-line-soft) !important; border-left: 4px solid var(--sp-accent) !important; }
body.wl-sp-bugs .gallery a { border-radius: 0 !important; border: 2px solid var(--px-line-mid) !important; }
body.wl-sp-bugs .lock-tip { border-radius: 0 !important; border-style: dashed !important; }
body.wl-sp-bugs #lightbox .sheet { background: #050806 !important; border-top-width: 3px !important; border-color: #000 !important; }
body.wl-sp-bugs #lightbox img { border-radius: 0 !important; image-rendering: auto; }
body.wl-sp-bugs .skel { height: 84px; }
body.wl-sp-bugs .gate .big, body.wl-sp-bugs .empty .big { display: flex; justify-content: center; }
body.wl-sp-bugs .sp-hero-main { min-width: 0; }
body.wl-sp-bugs .card .ico [data-px] { width: 24px; height: 24px; }
body.wl-sp-bugs .sp-term { min-height: 236px; }

@keyframes spIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

@media (max-width: 820px) {
  body.wl-sp-bugs .hero { grid-template-columns: 1fr; gap: 26px; padding-top: 36px; }
  body.wl-sp-bugs .hero h1 { font-size: 48px !important; }
}
@media (max-width: 560px) {
  body.wl-sp .brand b, body.wl-sp .archive-header .brand-title, body.wl-sp .user-header .brand-title, body.wl-sp .wiki-brand-link { font-size: 12px !important; letter-spacing: .04em !important; }
  body.wl-sp-bugs .hero h1 { font-size: 36px !important; }
  body.wl-sp-bugs .stat .n { font-size: 24px !important; }
  body.wl-sp-bugs .stat [data-px] { width: 20px !important; height: 20px !important; }
  .sp-term { font-size: 12px; }
  .sp-bar { width: 84px; }
}

/* ==========================================================================
   B · 影像档案馆：胶片档案
   ========================================================================== */
body.wl-sp-mem .hero-wrap { position: relative; }
body.wl-sp-mem .hero-title {
  font-family: var(--font-pixel) !important; font-size: 48px !important; font-weight: 400 !important; letter-spacing: 0 !important;
  -webkit-font-smoothing: none; line-height: 1.2 !important;
  background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--px-ink) !important;
  text-shadow: 4px 4px 0 var(--sp-accent-soft);
}
.sp-film-strip {
  height: 28px; margin: 22px auto 6px; max-width: 760px;
  background:
    repeating-linear-gradient(90deg, var(--px-bg) 0 10px, transparent 10px 22px) 0 5px / 100% 6px no-repeat,
    repeating-linear-gradient(90deg, var(--px-bg) 0 10px, transparent 10px 22px) 0 17px / 100% 6px no-repeat,
    #1d1914;
  border: 3px solid var(--px-line);
  box-shadow: 5px 5px 0 0 var(--px-hard);
  animation: spReel 6s linear infinite;
}
@keyframes spReel { to { background-position: 44px 5px, 44px 17px, 0 0; } }
.sp-film-hud {
  display: inline-flex; gap: 14px; align-items: center; margin-top: 14px;
  font-family: var(--font-pixel); font-size: 12px; letter-spacing: .1em; -webkit-font-smoothing: none;
  color: var(--px-ink-2); padding: 6px 12px; background: var(--px-surface); border: 2px solid var(--px-line-mid); box-shadow: 3px 3px 0 0 var(--px-hard);
}
.sp-film-hud .rec { color: var(--px-red); display: inline-flex; align-items: center; gap: 6px; }
.sp-film-hud .rec::before { content: ""; width: 8px; height: 8px; background: currentColor; animation: spBlink 1.2s steps(1) infinite; }
.sp-film-hud [data-px] { width: 20px; height: 20px; }

body.wl-sp-mem .filter-bar { gap: 10px !important; }
body.wl-sp-mem .filter-btn {
  border-radius: 0 !important; backdrop-filter: none !important;
  background: var(--px-surface) !important; color: var(--px-ink) !important;
  border: 2px solid var(--px-line-mid) !important; box-shadow: 3px 3px 0 0 var(--px-hard) !important;
  font-weight: 700 !important; transition: transform .12s ease !important;
}
body.wl-sp-mem .filter-btn:hover:not(:disabled) { transform: translate(-1px, -1px); border-color: var(--sp-accent) !important; }
body.wl-sp-mem .filter-btn.is-active { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; border-color: var(--px-line) !important; }
body.wl-sp-mem .filter-album-state { border-radius: 0 !important; font-family: var(--font-pixel); font-size: 12px !important; font-weight: 400 !important; }

/* 胶片帧卡片（两种主题下都是暗房胶片） */
body.wl-sp-mem .photo-card {
  --film: #1d1914;
  position: relative;
  border-radius: 0 !important; backdrop-filter: none !important;
  background: var(--film) !important; color: #f3ead8 !important;
  border: 3px solid var(--px-line) !important;
  padding: 16px 10px 16px !important;
  box-shadow: 5px 5px 0 0 var(--px-hard) !important;
  transition: transform .14s steps(3), box-shadow .14s steps(3) !important;
  animation: spIn .4s steps(5) both;
}
body.wl-sp-mem .photo-card::before, body.wl-sp-mem .photo-card::after {
  content: ""; position: absolute; left: 6px; right: 6px; height: 6px; pointer-events: none;
  background: repeating-linear-gradient(90deg, #efe4cc 0 7px, transparent 7px 16px);
  opacity: .78;
}
body.wl-sp-mem .photo-card::before { top: 5px; }
body.wl-sp-mem .photo-card::after { bottom: 5px; }
body.wl-sp-mem .photo-card:hover, body.wl-sp-mem .photo-card:focus-visible {
  transform: translate(-3px, -3px) !important; box-shadow: 8px 8px 0 0 var(--sp-accent) !important; outline: none;
}
body.wl-sp-mem .photo-thumb-box { border-radius: 0 !important; border: 2px solid #000; }
body.wl-sp-mem .photo-thumb-box img { border-radius: 0 !important; }
body.wl-sp-mem .photo-card:hover .photo-thumb-box img { transform: scale(1.04) !important; }
body.wl-sp-mem .photo-tag {
  border-radius: 0 !important; backdrop-filter: none !important;
  background: #f2b84b !important; color: #1d1406 !important; border: 2px solid #000 !important;
  font-family: var(--font-pixel); font-size: 12px !important; font-weight: 400 !important; -webkit-font-smoothing: none;
  box-shadow: 2px 2px 0 0 rgba(0, 0, 0, .5);
}
body.wl-sp-mem .photo-caption { padding: 12px 4px 4px !important; }
body.wl-sp-mem .photo-title { color: #f3ead8 !important; }
body.wl-sp-mem .photo-date, body.wl-sp-mem .photo-author, body.wl-sp-mem .photo-meta-sub { color: #b9ab90 !important; font-family: var(--font-mono); font-size: 12px !important; }

/* 投影灯箱 */
body.wl-sp-mem .lightbox-modal { background: transparent !important; }
body.wl-sp-mem .lightbox-modal::backdrop { background: rgba(5, 4, 3, .9) !important; }
body.wl-sp-mem .lightbox-view {
  background: #110e0b !important; border: 3px solid #000 !important; border-radius: 0 !important;
  box-shadow: 0 0 0 3px #2b241b, 10px 10px 0 0 rgba(0, 0, 0, .6) !important;
  padding: 16px 0 0 !important; position: relative;
}
body.wl-sp-mem .lightbox-view::before {
  content: ""; position: absolute; left: 8px; right: 8px; top: 5px; height: 6px;
  background: repeating-linear-gradient(90deg, #efe4cc 0 7px, transparent 7px 16px); opacity: .6;
}
body.wl-sp-mem .lightbox-photo-box, body.wl-sp-mem .lightbox-photo-box img { border-radius: 0 !important; }
body.wl-sp-mem .lightbox-bar { border-radius: 0 !important; background: #1d1914 !important; border-top: 3px solid #000 !important; color: #f3ead8 !important; }
body.wl-sp-mem .lightbox-bar-badge { border-radius: 0 !important; background: #f2b84b !important; color: #1d1406 !important; font-family: var(--font-pixel); font-size: 12px !important; font-weight: 400 !important; }
body.wl-sp-mem .lightbox-bar-right { font-family: var(--font-mono); color: #b9ab90 !important; }
body.wl-sp-mem .lightbox-close, body.wl-sp-mem .lightbox-nav { background: #1d1914 !important; color: #f3ead8 !important; border-color: #f2b84b !important; }
body.wl-sp-mem .lightbox-close:hover, body.wl-sp-mem .lightbox-nav:hover { background: #f2b84b !important; color: #1d1406 !important; }

/* 暗房投稿 */
body.wl-sp-mem .upload-dropzone {
  border-radius: 0 !important; border: 3px dashed var(--px-line-mid) !important;
  background: repeating-linear-gradient(45deg, transparent 0 12px, var(--sp-accent-soft) 12px 14px), var(--px-surface-2) !important;
}
body.wl-sp-mem .upload-dropzone:hover, body.wl-sp-mem .upload-dropzone.is-dragover { border-color: var(--sp-accent) !important; }
body.wl-sp-mem #uploadPreviewWrap, body.wl-sp-mem #uploadPreviewImg { border-radius: 0 !important; }
body.wl-sp-mem #uploadPhotoForm > div[style*="border-radius"], body.wl-sp-mem #uploadUserIdentityBadge { border-radius: 0 !important; border-style: dashed !important; }
body.wl-sp-mem #btnRemoveUploadedPhoto, body.wl-sp-mem #btnChangeUploadedPhoto { border-radius: 0 !important; }
body.wl-sp-mem .archive-footer { border-top: 3px solid var(--px-line-soft) !important; background: transparent !important; }
body.wl-sp-mem #themeToggleBtn #themeLabel::before { display: none !important; }

@media (max-width: 760px) {
  body.wl-sp-mem .hero-title { font-size: 36px !important; }
}
@media (max-width: 480px) {
  body.wl-sp-mem .hero-title { font-size: 24px !important; }
  body.wl-sp-mem .brand-subtitle { display: none !important; }
}

/* ==========================================================================
   C · 居民档案：身份卡 / 皮肤展示台 / 属性面板
   ========================================================================== */
body.wl-sp-user :is(.profile-card, .base-card, .leaf-card, .metric-item, .bcard) {
  border-radius: 0 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
body.wl-sp-user .profile-card {
  position: relative;
  background:
    linear-gradient(90deg, var(--sp-accent-soft) 0 1px, transparent 1px) 0 0 / 12px 12px,
    var(--px-surface) !important;
  border: 3px solid var(--px-line) !important;
  box-shadow: 8px 8px 0 0 var(--px-hard) !important;
  padding-top: 46px !important;
}
body.wl-sp-user .profile-card::before {
  content: "WHITELEAF · RESIDENT ID"; position: absolute; left: 0; right: 0; top: 0; height: 28px;
  display: flex; align-items: center; padding: 0 16px;
  background: var(--sp-accent); color: var(--sp-accent-ink);
  font-family: var(--font-pixel); font-size: 12px; letter-spacing: .14em; -webkit-font-smoothing: none;
  border-bottom: 3px solid var(--px-line);
}
body.wl-sp-user .profile-card::after {
  content: ""; position: absolute; right: 14px; top: 9px; width: 60px; height: 10px;
  background: repeating-linear-gradient(90deg, var(--sp-accent-ink) 0 6px, transparent 6px 10px); opacity: .7;
}
/* 皮肤展示台：方块底座 */
body.wl-sp-user .avatar-box {
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, transparent 0 calc(100% - 18px), #5fa043 calc(100% - 18px) calc(100% - 12px), #7a5536 calc(100% - 12px)),
    linear-gradient(var(--px-surface-2), var(--px-surface-2)) !important;
  border: 3px solid var(--px-line) !important;
  box-shadow: 5px 5px 0 0 var(--px-hard) !important;
}
body.wl-sp-user .avatar-img { border-radius: 0 !important; image-rendering: pixelated; }
/* BAIYE-151 拖动旋转提示：钉在草地上的像素告示牌，高对比 + 箭头轻推；随深浅主题切换 */
html[data-theme="dark"] body.wl-sp-user, body.wl-sp-user { --hint-bg: rgba(20, 28, 22, .88); --hint-ink: #fff; --hint-line: #0b0f0c; --hint-hi: rgba(255,255,255,.14); --hint-shadow: rgba(0,0,0,.35); --hint-ts: 1px 1px 0 #000; --hint-arrow: #86efac; }
html[data-theme="light"] body.wl-sp-user { --hint-bg: rgba(252, 253, 249, .94); --hint-ink: #1f2a22; --hint-line: #2f3f33; --hint-hi: #fff; --hint-shadow: rgba(47, 63, 51, .28); --hint-ts: none; --hint-arrow: #16a34a; }
body.wl-sp-user .skin-hint {
  left: 50% !important; right: auto !important; bottom: 1px !important;
  display: inline-flex; align-items: center; gap: 5px; white-space: nowrap;
  padding: 3px 7px; border-radius: 0 !important;
  font-family: var(--font-pixel); font-size: 12px !important; font-weight: 400 !important; line-height: 1; letter-spacing: .06em;
  color: var(--hint-ink) !important; background: var(--hint-bg);
  border: 2px solid var(--hint-line); box-shadow: inset 0 0 0 1px var(--hint-hi), 2px 2px 0 0 var(--hint-shadow);
  text-shadow: var(--hint-ts);
  transform: translate(-50%, 4px); transition: opacity .4s ease, transform .4s ease !important;
}
body.wl-sp-user .skin-stage.is-3d .skin-hint { opacity: 1 !important; transform: translate(-50%, 0); }
body.wl-sp-user .skin-stage.is-3d.hint-done .skin-hint { opacity: .45 !important; }
body.wl-sp-user .skin-stage.is-3d.hint-done:hover .skin-hint { opacity: .9 !important; }
body.wl-sp-user .skin-hint-ico { display: block; fill: var(--hint-arrow); flex: none; }
body.wl-sp-user .skin-hint-ico .l { animation: wlHintL 1.4s steps(2, jump-none) infinite; }
body.wl-sp-user .skin-hint-ico .r { animation: wlHintR 1.4s steps(2, jump-none) infinite; }
body.wl-sp-user .skin-stage.hint-done .skin-hint-ico g { animation: none; }
@keyframes wlHintL { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(-1px); } }
@keyframes wlHintR { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(1px); } }
@media (prefers-reduced-motion: reduce) { body.wl-sp-user .skin-hint-ico g { animation: none !important; } }
body.wl-sp-user .user-nickname { letter-spacing: 0 !important; }
body.wl-sp-user .user-mcname { font-family: var(--font-mono) !important; color: var(--sp-accent) !important; }
body.wl-sp-user :is(.badge-res, .badge-title, .badge-passport, .badge-staff) {
  border-radius: 0 !important; border-width: 2px !important; box-shadow: 2px 2px 0 0 var(--px-hard);
}
body.wl-sp-user .badge-passport { font-family: var(--font-mono) !important; }
body.wl-sp-user .user-bio {
  border-radius: 0 !important; border: 2px dashed var(--px-line-mid) !important; background: var(--px-surface-2) !important;
}

/* 属性面板 */
body.wl-sp-user .metrics-grid { gap: 14px !important; }
body.wl-sp-user .metric-item {
  position: relative; overflow: hidden;
  background: var(--px-surface) !important;
  border: 3px solid var(--px-line) !important;
  box-shadow: 5px 5px 0 0 var(--px-hard) !important;
  padding-bottom: 22px !important;
  transition: transform .12s steps(2) !important;
}
body.wl-sp-user .metric-item:hover { transform: translate(-2px, -2px); }
body.wl-sp-user .metric-item::after {
  content: ""; position: absolute; left: 12px; right: 12px; bottom: 9px; height: 6px;
  background: repeating-linear-gradient(90deg, var(--mc, var(--sp-accent)) 0 8px, transparent 8px 11px);
  opacity: .75;
}
body.wl-sp-user .metric-item:nth-child(1) { --mc: var(--px-accent); }
body.wl-sp-user .metric-item:nth-child(2) { --mc: var(--px-sky); }
body.wl-sp-user .metric-item:nth-child(3) { --mc: var(--px-amber); }
body.wl-sp-user .metric-item:nth-child(4) { --mc: #c98a3e; }
body.wl-sp-user .metric-item:nth-child(5) { --mc: var(--px-violet); }
body.wl-sp-user .metric-label { display: inline-flex !important; align-items: center; gap: 7px; }
body.wl-sp-user .metric-val {
  font-family: var(--font-pixel) !important; font-size: 24px !important; font-weight: 400 !important;
  letter-spacing: 0 !important; -webkit-font-smoothing: none;
}

/* 叶子卡 */
body.wl-sp-user .leaf-card { background: var(--px-surface) !important; border: 3px solid var(--px-line) !important; box-shadow: 5px 5px 0 0 var(--px-hard) !important; }
body.wl-sp-user .leaf-stage { border-radius: 0 !important; }
body.wl-sp-user .leaf-title { font-family: var(--font-pixel) !important; font-size: 24px !important; font-weight: 400 !important; -webkit-font-smoothing: none; }
body.wl-sp-user .leaf-seg { border-radius: 0 !important; border: 2px solid var(--px-line-mid) !important; padding: 3px !important; }
body.wl-sp-user .leaf-seg button { border-radius: 0 !important; }
body.wl-sp-user .leaf-seg button[aria-pressed="true"] { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; }

/* 基地：地图卡 */
body.wl-sp-user .base-card { background: var(--px-surface) !important; border: 3px solid var(--px-line) !important; box-shadow: 6px 6px 0 0 var(--px-hard) !important; }
body.wl-sp-user .base-name { font-family: var(--font-pixel) !important; font-size: 24px !important; font-weight: 400 !important; -webkit-font-smoothing: none; }
body.wl-sp-user .bcard {
  background: var(--px-surface-2) !important; border: 2px solid var(--px-line-mid) !important;
  box-shadow: 4px 4px 0 0 var(--px-hard) !important;
  transition: transform .12s steps(2), box-shadow .12s steps(2) !important;
}
body.wl-sp-user .bcard:hover { transform: translate(-2px, -2px) !important; box-shadow: 6px 6px 0 0 var(--px-hard) !important; border-color: var(--sp-accent) !important; }
body.wl-sp-user .bcard.is-featured { border-color: var(--px-amber) !important; }
body.wl-sp-user :is(.bcover, .bcover img, .bthumb, .bthumb img, .bphoto, .bphoto img, .bphoto-add, .bribbon, .bstatus, .bphoto-tag, .base-photo-frame, .base-photo-img, .base-empty-box, .bnote, .badd, .base-world-tag, .bcover-zoom, .bcover-count, .user-identity-pill, .user-pill-avatar, .decor-item, .order-card, .decor-tag, .studio-preview, .card-export-body img) {
  border-radius: 0 !important;
}
body.wl-sp-user .bcover { border-bottom: 2px solid var(--px-line-mid); }
body.wl-sp-user .bcoords, body.wl-sp-user .base-coords-val { font-family: var(--font-mono) !important; color: var(--sp-accent) !important; }
body.wl-sp-user .btitle { font-weight: 800; }
body.wl-sp-user .bribbon, body.wl-sp-user .bstatus { font-family: var(--font-pixel); font-weight: 400 !important; font-size: 12px !important; -webkit-font-smoothing: none; }
body.wl-sp-user .badd, body.wl-sp-user .bphoto-add, body.wl-sp-user .base-empty-box { border: 3px dashed var(--px-line-mid) !important; }
body.wl-sp-user .badd:hover, body.wl-sp-user .bphoto-add:hover { border-color: var(--sp-accent) !important; color: var(--sp-accent) !important; }
body.wl-sp-user .decor-item { border: 2px solid var(--px-line-mid) !important; box-shadow: 3px 3px 0 0 var(--px-hard); }
body.wl-sp-user .decor-item[aria-pressed="true"] { border-color: var(--sp-accent) !important; box-shadow: 3px 3px 0 0 var(--sp-accent) !important; }
body.wl-sp-user .studio-label { font-family: var(--font-pixel); font-size: 12px !important; font-weight: 400 !important; -webkit-font-smoothing: none; letter-spacing: .08em; }
body.wl-sp-user #editBaseForm > div[style*="border-radius"], body.wl-sp-user #baseFeedbackMsg { border-radius: 0 !important; border-style: dashed !important; }
body.wl-sp-user dialog#baseLightbox { background: #050806 !important; }
body.wl-sp-user .blb-stage img { border-radius: 0 !important; border: 3px solid #000; }
body.wl-sp-user .blb-bar { border-radius: 0 !important; }
body.wl-sp-user .blb-title { font-family: var(--font-body); }
body.wl-sp-user .blb-right { font-family: var(--font-mono); }
body.wl-sp-user .user-footer { border-top: 2px dashed var(--px-line-soft); }
@media (max-width: 560px) {
  body.wl-sp-user .metric-val { font-size: 24px !important; }
  body.wl-sp-user .profile-card::after { display: none; }
}

/* ==========================================================================
   D · 百科：附魔书三栏知识库
   ========================================================================== */
html[data-theme="light"] body.wl-sp-hb { --hb-paper: #fbf7ea; --hb-paper-2: #f3ecd6; --hb-spine: #3a2f5c; }
html[data-theme="dark"]  body.wl-sp-hb { --hb-paper: #181527; --hb-paper-2: #201c33; --hb-spine: #0c0a16; }

body.wl-sp-hb .wiki-brand-link { color: var(--px-ink) !important; }
body.wl-sp-hb .wiki-brand-link::before {
  content: ""; width: 22px; height: 22px; flex: none;
  background:
    linear-gradient(90deg, var(--hb-spine) 0 4px, transparent 4px) ,
    linear-gradient(var(--sp-accent), var(--sp-accent));
  border: 2px solid var(--px-line); box-shadow: 2px 2px 0 0 var(--px-hard);
  animation: spGlint 3s steps(6) infinite;
}
@keyframes spGlint { 0%, 70% { filter: none; } 80% { filter: brightness(1.5) saturate(1.3); } 100% { filter: none; } }

/* 左侧：书签目录 */
body.wl-sp-hb .wiki-sidebar-nav { border-right: 3px solid var(--px-line-soft) !important; }
body.wl-sp-hb .sidebar-group-title {
  font-size: 12px !important; letter-spacing: .06em !important; color: var(--sp-accent) !important;
  text-transform: none !important; display: flex; align-items: center; gap: 8px;
}
body.wl-sp-hb .sidebar-group-title::before { content: ""; width: 6px; height: 6px; background: currentColor; flex: none; }
body.wl-sp-hb .sidebar-link {
  border-radius: 0 !important; border: 2px solid transparent !important; margin-bottom: 4px !important;
  transition: transform .12s steps(2), background-color .12s, color .12s !important;
}
body.wl-sp-hb .sidebar-link:hover { background: var(--sp-accent-soft) !important; color: var(--px-ink) !important; transform: translateX(3px); }
body.wl-sp-hb .sidebar-link.is-active {
  position: relative; overflow: hidden;
  background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important;
  border-color: var(--px-line) !important; box-shadow: 3px 3px 0 0 var(--px-hard) !important;
}
body.wl-sp-hb .sidebar-link.is-active::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .35), transparent);
  animation: spEnchant 3.2s steps(16) infinite;
}
@keyframes spEnchant { to { left: 130%; } }

/* 中间：羊皮纸书页 */
body.wl-sp-hb .article-container.is-active {
  position: relative;
  background:
    linear-gradient(90deg, var(--hb-spine) 0 6px, transparent 6px),
    var(--hb-paper);
  border: 3px solid var(--px-line);
  box-shadow: 8px 8px 0 0 var(--px-hard);
  padding: 34px clamp(20px, 4vw, 48px) 36px clamp(26px, 4.4vw, 54px);
}
body.wl-sp-hb .article-container.is-active::before {
  content: ""; position: absolute; top: -3px; right: 28px; width: 18px; height: 40px;
  background: var(--sp-accent); clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 78%, 0 100%);
}
body.wl-sp-hb .breadcrumb-nav { font-family: var(--font-mono); font-size: 12px !important; }
body.wl-sp-hb .article-header { border-bottom: 3px dashed var(--px-line-mid) !important; }
body.wl-sp-hb .article-title {
  font-family: var(--font-pixel) !important; font-size: 36px !important; font-weight: 400 !important;
  letter-spacing: 0 !important; -webkit-font-smoothing: none; line-height: 1.25 !important;
  text-shadow: 3px 3px 0 var(--sp-accent-soft);
}
body.wl-sp-hb .article-meta { font-family: var(--font-mono); }
body.wl-sp-hb .wiki-p { color: var(--px-ink-2) !important; }
body.wl-sp-hb .wiki-h2 {
  font-family: var(--font-pixel) !important; font-size: 24px !important; font-weight: 400 !important; letter-spacing: 0 !important;
  -webkit-font-smoothing: none; display: flex; align-items: center; gap: 12px;
}
body.wl-sp-hb .wiki-h2::before {
  content: ""; width: 12px; height: 12px; flex: none; background: var(--sp-accent);
  box-shadow: 3px 3px 0 0 var(--px-hard);
  animation: spGlint 4s steps(6) infinite;
}
body.wl-sp-hb .wiki-h3 { font-weight: 800 !important; padding-left: 12px; border-left: 4px solid var(--sp-accent); }
body.wl-sp-hb .article-container div[style*="border-radius"] { border-radius: 0 !important; border-width: 2px !important; box-shadow: 4px 4px 0 0 var(--px-hard); }
body.wl-sp-hb .wiki-card {
  border-radius: 0 !important; background: var(--hb-paper-2) !important;
  border: 2px solid var(--px-line-mid) !important; box-shadow: 4px 4px 0 0 var(--px-hard) !important;
  transition: transform .12s steps(2), box-shadow .12s steps(2) !important;
}
body.wl-sp-hb .wiki-card:hover { transform: translate(-2px, -2px) !important; box-shadow: 6px 6px 0 0 var(--px-hard) !important; border-color: var(--sp-accent) !important; }
body.wl-sp-hb .wiki-table { border-radius: 0 !important; border: 3px solid var(--px-line) !important; box-shadow: 5px 5px 0 0 var(--px-hard) !important; background: var(--hb-paper-2) !important; }
body.wl-sp-hb .wiki-table th { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; border-bottom: 3px solid var(--px-line) !important; }
body.wl-sp-hb .wiki-table td { border-bottom: 2px dashed var(--px-line-soft) !important; }
body.wl-sp-hb .wiki-table tr:nth-child(even) td { background: color-mix(in srgb, var(--sp-accent) 4%, transparent); }
body.wl-sp-hb code { font-family: var(--font-mono); background: var(--sp-accent-soft); padding: 1px 5px; }
/* 命令方块 */
body.wl-sp-hb .cmd-badge {
  border-radius: 0 !important;
  background: #14121f !important; color: #a6e07f !important;
  border: 2px solid #000 !important; box-shadow: 2px 2px 0 0 var(--px-hard) !important;
  font-family: var(--font-mono) !important;
}
body.wl-sp-hb .cmd-badge:hover { background: #a6e07f !important; color: #0b1a12 !important; transform: translate(-1px, -1px) !important; }
body.wl-sp-hb .pagination-card {
  border-radius: 0 !important; background: var(--hb-paper-2) !important;
  border: 2px solid var(--px-line-mid) !important; box-shadow: 4px 4px 0 0 var(--px-hard) !important;
}
body.wl-sp-hb .pagination-card:hover { border-color: var(--sp-accent) !important; transform: translate(-2px, -2px) !important; }
body.wl-sp-hb .pagination-label { font-size: 12px !important; color: var(--sp-accent) !important; }
body.wl-sp-hb .article-pagination { border-top: 3px dashed var(--px-line-mid) !important; }

/* 右侧：动态目录 */
body.wl-sp-hb .toc-title { font-size: 12px !important; color: var(--sp-accent) !important; letter-spacing: .1em !important; }
body.wl-sp-hb .toc-link { border-left: 3px solid var(--px-line-soft) !important; margin-left: 0 !important; }
body.wl-sp-hb .toc-link:hover { color: var(--px-ink) !important; border-left-color: var(--px-line-mid) !important; }
body.wl-sp-hb .toc-link.is-active { color: var(--sp-accent) !important; border-left-color: var(--sp-accent) !important; background: var(--sp-accent-soft); }

@media (max-width: 768px) {
  body.wl-sp-hb .wiki-sidebar-nav { background: var(--px-surface) !important; border-right: 3px solid var(--px-line) !important; box-shadow: 6px 0 0 0 var(--px-hard) !important; }
  body.wl-sp-hb .article-title { font-size: 24px !important; }
  body.wl-sp-hb .article-container.is-active { padding: 24px 16px 26px 22px; box-shadow: 5px 5px 0 0 var(--px-hard); }
  body.wl-sp-hb .wiki-table { display: block; overflow-x: auto; }
  body.wl-sp-hb .wiki-header .wiki-back-btn span { display: none; }
}

/* ---------- 减少动画 ---------- */
@media (prefers-reduced-motion: reduce) {
  body.wl-sp *, body.wl-sp *::before, body.wl-sp *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important;
  }
  .sp-film-strip { animation: none !important; }
}

body.wl-sp-bugs .stat { padding-right: 52px !important; }
body.wl-sp-bugs .stat .l { overflow-wrap: anywhere; }

/* B+ 胶片帧编号 / 空状态 */
body.wl-sp-mem .gallery-grid { counter-reset: spFrame; }
body.wl-sp-mem .photo-card { counter-increment: spFrame; }
body.wl-sp-mem .photo-thumb-box::after {
  content: "FRAME " counter(spFrame, decimal-leading-zero);
  position: absolute; right: 8px; bottom: 8px; padding: 2px 6px;
  background: rgba(0, 0, 0, .66); color: #f2b84b; border: 1px solid #f2b84b;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; pointer-events: none;
}
body.wl-sp-mem .photo-thumb-box { position: relative; }
.sp-mem-empty {
  grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center;
  padding: 56px 20px; color: var(--px-ink-2); font-size: 14px; line-height: 1.8;
  border: 3px dashed var(--px-line-mid); background: repeating-linear-gradient(45deg, transparent 0 12px, var(--sp-accent-soft) 12px 14px);
}
.sp-mem-empty b { font-family: var(--font-pixel); font-weight: 400; font-size: 24px; color: var(--px-ink); -webkit-font-smoothing: none; }
.sp-film-hud b { font-family: var(--font-pixel); font-weight: 400; color: var(--sp-accent); font-size: 12px; }
@media (max-width: 560px) { .sp-film-hud { flex-wrap: wrap; justify-content: center; gap: 8px 10px; max-width: 100%; } .sp-film-strip { margin-left: 8px; margin-right: 8px; } }

/* BAIYE-149 百科移动端头部：品牌名收缩，主题按钮不被挤出 */
@media (max-width: 560px) {
  body.wl-sp-hb .wiki-header-left { min-width: 0; flex: 1 1 auto; gap: 10px !important; }
  body.wl-sp-hb .wiki-brand-link { min-width: 0; overflow: hidden; }
  body.wl-sp-hb .wiki-brand-link > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body.wl-sp-hb .wiki-header-right { flex: none; margin-left: 8px; }
}

/* ==========================================================================
   BAIYE-151d · 灯箱跟随深浅主题（Bugs 截图灯箱 / 档案基地大图 / 相册投影灯箱）
   ========================================================================== */
body.wl-sp, html[data-theme="dark"] body.wl-sp {
  --lb-backdrop: rgba(3, 7, 5, .92); --lb-stage: #050806; --lb-panel: #0d1410; --lb-line: #000;
  --lb-ring: #1f2c25; --lb-ink: #eef3e8; --lb-dim: #9fb0a3; --lb-btn: #16231d; --lb-btn-ink: #eef3e8;
  --lb-btn-line: rgba(233, 239, 226, .28); --lb-shadow: rgba(0, 0, 0, .6); --lb-fade: rgba(0, 0, 0, .72);
}
html[data-theme="light"] body.wl-sp {
  --lb-backdrop: rgba(236, 241, 232, .94); --lb-stage: #eef2ea; --lb-panel: #ffffff; --lb-line: #24321f;
  --lb-ring: #cfd9c8; --lb-ink: #1f2b22; --lb-dim: #5d6c5f; --lb-btn: #ffffff; --lb-btn-ink: #1f2b22;
  --lb-btn-line: #24321f; --lb-shadow: rgba(36, 50, 31, .22); --lb-fade: rgba(246, 249, 243, .96);
}
/* 相册：深色暗房 / 浅色相纸 */
body.wl-sp-mem, html[data-theme="dark"] body.wl-sp-mem {
  --lb-backdrop: rgba(5, 4, 3, .9); --lb-panel: #110e0b; --lb-bar: #1d1914; --lb-line: #000; --lb-ring: #2b241b;
  --lb-ink: #f3ead8; --lb-dim: #b9ab90; --lb-film: #efe4cc; --lb-btn: #1d1914; --lb-btn-ink: #f3ead8;
}
html[data-theme="light"] body.wl-sp-mem {
  --lb-backdrop: rgba(244, 238, 224, .95); --lb-panel: #fbf6ea; --lb-bar: #f3ead6; --lb-line: #2b241b; --lb-ring: #d8cbb0;
  --lb-ink: #2b2117; --lb-dim: #7a6a52; --lb-film: #2b241b; --lb-btn: #fbf6ea; --lb-btn-ink: #2b2117;
}

/* Bugs 截图灯箱 */
html body.wl-sp-bugs #lightbox::backdrop { background: var(--lb-backdrop) !important; }
html body.wl-sp-bugs #lightbox .sheet {
  background: var(--lb-panel) !important; border-color: var(--lb-line) !important; border-top-color: var(--sp-accent) !important;
  box-shadow: 0 0 0 3px var(--lb-ring), 8px 8px 0 0 var(--lb-shadow) !important;
}
html body.wl-sp-bugs #lightbox img { border: 2px solid var(--lb-line); }

/* 档案页基地大图 */
html body.wl-sp-user dialog#baseLightbox { background: var(--lb-stage) !important; color: var(--lb-ink); }
html body.wl-sp-user dialog#baseLightbox::backdrop { background: var(--lb-backdrop) !important; }
html body.wl-sp-user .blb-stage img { border-color: var(--lb-line) !important; box-shadow: 8px 8px 0 0 var(--lb-shadow) !important; }
html body.wl-sp-user :is(.blb-btn, .blb-close) { background: var(--lb-btn) !important; color: var(--lb-btn-ink) !important; border-color: var(--lb-btn-line) !important; box-shadow: 2px 2px 0 0 var(--lb-shadow) !important; }
html body.wl-sp-user .blb-btn:hover { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; border-color: var(--lb-line) !important; }
html body.wl-sp-user .blb-close:hover { background: var(--px-red) !important; color: #fff !important; border-color: var(--lb-line) !important; }
html body.wl-sp-user .blb-bar { color: var(--lb-ink) !important; background: linear-gradient(transparent, var(--lb-fade) 55%) !important; }
html body.wl-sp-user .blb-sub { color: var(--lb-dim); opacity: 1 !important; }
html body.wl-sp-user .blb-right { color: var(--lb-dim); }
html body.wl-sp-user .blb-right a { color: var(--lb-ink) !important; opacity: 1 !important; border: 2px solid var(--lb-btn-line) !important; border-radius: 0 !important; background: var(--lb-btn); }
html body.wl-sp-user .blb-right a:hover { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; }

/* 相册投影灯箱 */
html body.wl-sp-mem .lightbox-modal::backdrop { background: var(--lb-backdrop) !important; }
html body.wl-sp-mem .lightbox-view { background: var(--lb-panel) !important; border-color: var(--lb-line) !important; box-shadow: 0 0 0 3px var(--lb-ring), 10px 10px 0 0 var(--lb-shadow) !important; }
html body.wl-sp-mem .lightbox-view::before { background: repeating-linear-gradient(90deg, var(--lb-film) 0 7px, transparent 7px 16px) !important; }
html body.wl-sp-mem .lightbox-photo-box { border-color: var(--lb-line) !important; }
html body.wl-sp-mem .lightbox-bar { background: var(--lb-bar) !important; border: 0 !important; border-top: 3px solid var(--lb-line) !important; color: var(--lb-ink) !important; }
html body.wl-sp-mem .lightbox-bar-title { color: var(--lb-ink) !important; }
html body.wl-sp-mem .lightbox-bar-badge { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; }
html body.wl-sp-mem .lightbox-bar-right { color: var(--lb-dim) !important; }
html body.wl-sp-mem :is(.lightbox-close, .lightbox-nav) { background: var(--lb-btn) !important; color: var(--lb-btn-ink) !important; border-color: var(--sp-accent) !important; box-shadow: 2px 2px 0 0 var(--lb-shadow) !important; }
html body.wl-sp-mem :is(.lightbox-close, .lightbox-nav):hover { background: var(--sp-accent) !important; color: var(--sp-accent-ink) !important; }