:root {
      /* 经典翡翠点阵绿 (天龙传奇 默认风格) */
      /* 层级刻度：贴表格首列 / 屏内面板 / 地图标记 / 扫描线蒙层 / 弹窗 */
      --z-sticky: 1;
      --z-panel: 2;
      --z-marker: 3;
      --z-marker-active: 4;
      --z-overlay: 10;
      --z-modal: 100;
      --lcd-bg: #8ca374;
      --lcd-bg-dark: #768f5e;
      --lcd-text: #17240f;
      --lcd-text-dim: #2a3820;
      --lcd-highlight: #2c421b;
      --lcd-accent: #0f1909;
      --lcd-gold: #cfa838;
      --lcd-danger: #8a2424;

      /* 机体外壳 */
      --case-base: #dcdfd8;
      --case-border: #b5baa8;
      --case-shadow: #888e7b;
      --case-dark: #293026;
      --case-btn: #ebefe5;

      --font-pixel: 'Courier New', 'SimSun', 'Zpix', monospace, sans-serif;
    }

    [data-game="tianming"] {
      /* 暖琥珀/沉郁青铜 (天明 淮西乱世风格) */
      --lcd-bg: #9e9772;
      --lcd-bg-dark: #87805b;
      --lcd-text: #241e0f;
      --lcd-text-dim: #352e1c;
      --lcd-highlight: #423616;
      --lcd-accent: #171308;
      --lcd-gold: #d49b28;
      --lcd-danger: #82221b;

      --case-base: #d8d4c9;
      --case-border: #bab3a2;
      --case-shadow: #8f8774;
      --case-dark: #2e2a22;
      --case-btn: #ebe7dc;
    }

    [data-game="tianjiang"] {
      /* 冷靛霜青 (天降风云录 云海苍茫风格) */
      --lcd-bg: #86999b;
      --lcd-bg-dark: #6d8285;
      --lcd-text: #101f22;
      --lcd-text-dim: #1f3234;
      --lcd-highlight: #1b383c;
      --lcd-accent: #0a1517;
      --lcd-gold: #c9a24a;
      --lcd-danger: #8a2b2b;

      --case-base: #d3d8d8;
      --case-border: #aeb8b8;
      --case-shadow: #838d8d;
      --case-dark: #242b2c;
      --case-btn: #e5eaea;
    }

    [data-theme="dark-crt"] {
      --lcd-bg: #131713;
      --lcd-bg-dark: #0a0d0a;
      --lcd-text: #8fc77b;
      --lcd-text-dim: #608c4f;
      --lcd-highlight: #b2f59b;
      --lcd-accent: #d8ffd0;
      --lcd-gold: #ffda66;
      --lcd-danger: #ff6b6b;
      --case-base: #1c201c;
      --case-border: #2c332c;
      --case-shadow: #0f120f;
      --case-dark: #090a09;
      --case-btn: #2a332a;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      user-select: none;
      -webkit-user-select: none;
    }

    body {
      background: #181c19;
      font-family: var(--font-pixel);
      color: var(--lcd-text);
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 16px;
      image-rendering: pixelated;
    }

    /* 顶部卡带与全局切换 */
    .top-cartridge-shelf {
      width: 100%;
      max-width: 1220px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 12px;
      color: #9cb095;
      font-size: 13px;
      flex-wrap: wrap;
      gap: 8px 16px;
    }

    .cartridge-selector {
      display: flex;
      gap: 10px;
      align-items: center;
      flex-wrap: wrap;
    }

    .cart-slot-label, .theme-toggles > span {
      font-weight: bold;
      letter-spacing: 1px;
      white-space: nowrap;
    }
    .theme-toggles > span { font-weight: normal; letter-spacing: 0; }

    .cart-btn {
      padding: 6px 14px;
      background: #283028;
      border: 2px solid #4a5948;
      color: #b8c9b3;
      cursor: pointer;
      font-family: inherit;
      font-size: 12px;
      font-weight: bold;
      border-radius: 4px;
      display: flex;
      align-items: center;
      gap: 6px;
      transition: background-color 0.1s, color 0.1s, border-color 0.1s, box-shadow 0.1s;
    }
    @media (hover: hover) and (pointer: fine) {
    .cart-btn:hover {
      background: #3c4a3b;
      color: #fff;
    }
    }
    .cart-btn.active {
      background: #546e50;
      color: #fff;
      border-color: #9ec995;
      box-shadow: 0 0 10px rgba(158, 201, 149, 0.4);
    }

    .theme-toggles {
      display: flex;
      gap: 6px;
      align-items: center;
    }

    .chip-btn {
      background: #252b25;
      border: 1px solid #414d40;
      color: #9cb095;
      padding: 3px 8px;
      font-size: 11px;
      cursor: pointer;
      border-radius: 2px;
    }
    .chip-btn.active {
      background: #475745;
      color: #fff;
      border-color: #8db587;
    }
    @media (hover: hover) and (pointer: fine) {
    .chip-btn:hover {
      background: #475745;
      color: #fff;
      border-color: #8db587;
    }
    }

    /* 键盘焦点：全站统一可见轮廓，深色机壳与液晶屏各配一色 */
    :focus-visible {
      outline: 2px solid var(--lcd-text);
      outline-offset: 2px;
    }
    .cart-btn:focus-visible, .chip-btn:focus-visible, .top-cartridge-shelf :focus-visible {
      outline-color: #9ec995;
    }
    .fkey-tab:focus-visible {
      outline-color: var(--lcd-bg);
      outline-offset: -3px;
    }
    .fkey-tab.active:focus-visible {
      outline-color: var(--lcd-text);
    }
    .retro-table tbody tr:focus-visible {
      outline-offset: -2px;
    }

    /* 学习机机身 (Hardware Chassis) */
    .noah-device {
      width: 100%;
      max-width: 1220px;
      background: var(--case-base);
      border-radius: 18px;
      padding: 24px 30px;
      border: 4px solid var(--case-border);
      box-shadow:
        0 24px 50px rgba(0,0,0,0.7),
        inset 0 2px 0 rgba(255,255,255,0.7),
        inset 0 -4px 0 var(--case-shadow);
      position: relative;
    }

    .device-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 14px;
      padding: 0 6px;
    }

    .brand-logo {
      font-size: 18px;
      font-weight: 900;
      color: var(--case-dark);
      letter-spacing: 2px;
      display: flex;
      align-items: baseline;
      gap: 8px;
    }
    .brand-logo .sub-tag {
      font-size: 11px;
      background: rgba(0,0,0,0.12);
      padding: 1px 6px;
      border-radius: 2px;
      font-weight: normal;
    }

    /* 机壳上的访客计数窗口 */
    .visitor-odometer {
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .visitor-odometer .odo-label {
      font-size: 9px;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: var(--case-dark);
      opacity: 0.7;
      white-space: nowrap;
    }
    .visitor-odometer .odo-window {
      position: relative;
      display: inline-block;
      background: #0b0e0b;
      border-radius: 2px;
      padding: 2px 6px;
      box-shadow: inset 0 1px 3px rgba(0,0,0,0.9), inset 0 -1px 0 rgba(255,255,255,0.08);
    }
    .visitor-odometer .odo-digits,
    .visitor-odometer .odo-ghost {
      font-family: "Courier New", ui-monospace, monospace;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 2px;
    }
    .visitor-odometer .odo-digits {
      position: relative;
      color: #9be15d;
      text-shadow: 0 0 4px rgba(155,225,93,0.55);
    }
    .visitor-odometer .odo-ghost {
      position: absolute;
      left: 6px;
      top: 2px;
      color: #9be15d;
      opacity: 0.12;
      text-shadow: none;
      pointer-events: none;
    }
    .visitor-odometer.is-idle .odo-digits {
      color: #5c6a5c;
      text-shadow: none;
    }
    [data-theme="dark-crt"] .visitor-odometer .odo-label {
      color: var(--lcd-text-dim);
      opacity: 1;
    }
    [data-theme="dark-crt"] .visitor-odometer .odo-window {
      background: #050705;
    }
    [data-theme="dark-crt"] .visitor-odometer .odo-digits {
      color: var(--lcd-highlight);
      text-shadow: 0 0 5px rgba(178,245,155,0.6);
    }
    [data-theme="dark-crt"] .visitor-odometer .odo-ghost { color: var(--lcd-highlight); }
    [data-theme="dark-crt"] .visitor-odometer.is-idle .odo-digits {
      color: var(--lcd-text-dim);
      text-shadow: none;
    }
    @media (max-width: 520px) {
      .visitor-odometer .odo-label { display: none; }
    }

    /* 屏幕总成与边框 */
    .screen-bezel {
      background: #2b3327;
      padding: 14px;
      border-radius: 8px;
      box-shadow:
        inset 0 3px 8px rgba(0,0,0,0.8),
        0 1px 0 rgba(255,255,255,0.3);
    }

    .lcd-screen {
      background: var(--lcd-bg);
      border: 2px solid var(--lcd-bg-dark);
      border-radius: 4px;
      height: 590px;
      max-height: 590px;
      min-height: 590px;
      color: var(--lcd-text);
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
      box-shadow: inset 0 0 24px rgba(0,0,0,0.15);
    }

    .lcd-screen::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(rgba(0,0,0,0.03) 50%, transparent 50%),
        linear-gradient(90deg, rgba(0,0,0,0.03) 50%, transparent 50%);
      background-size: 3px 3px;
      pointer-events: none;
      z-index: var(--z-overlay);
    }

    /* 1. 液晶状态顶栏 */
    .lcd-top-bar {
      height: 28px;
      border-bottom: 2px solid var(--lcd-text-dim);
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 12px;
      font-size: 12px;
      font-weight: bold;
      background: rgba(0,0,0,0.06);
      z-index: var(--z-panel);
    }

    .status-group {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .pill-badge {
      border: 1px solid var(--lcd-text);
      padding: 0 4px;
      font-size: 10px;
    }

    /* 2. 实体快捷功能标签条 (F1~F6 模式A核心导航) */
    .lcd-fkey-bar {
      display: flex;
      background: var(--lcd-text-dim);
      color: var(--lcd-bg);
      padding: 3px;
      gap: 4px;
      font-size: 12px;
      z-index: var(--z-panel);
    }

    .fkey-tab {
      flex: 1;
      background: transparent;
      border: 1px solid transparent;
      color: var(--lcd-bg);
      font-family: inherit;
      font-size: 12px;
      padding: 5px 2px;
      text-align: center;
      cursor: pointer;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 4px;
    }

    @media (hover: hover) and (pointer: fine) {
    .fkey-tab:hover {
      background: rgba(0,0,0,0.15);
    }
    }

    .fkey-tab.active {
      background: var(--lcd-bg);
      color: var(--lcd-text);
      font-weight: bold;
      border: 1px solid var(--lcd-text);
    }

    .fkey-tab .key-tag {
      font-size: 9px;
      opacity: 0.8;
      border: 1px solid currentColor;
      padding: 0 2px;
    }

    /* 3. 屏幕主视口 (双栏布局 - 高度严密约束) */
    .lcd-viewport {
      flex: 1;
      min-height: 0;
      height: calc(100% - 60px);
      display: grid;
      grid-template-columns: 280px 1fr;
      overflow: hidden;
      z-index: var(--z-panel);
    }

    /* 左侧目录：模式A上下文联动侧边栏 */
    .lcd-sidebar {
      border-right: 2px solid var(--lcd-text-dim);
      padding: 12px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      background: rgba(0,0,0,0.03);
      height: 100%;
      overflow-y: auto;
    }

    /* 自定义复古滚动条 */
    .lcd-sidebar::-webkit-scrollbar,
    .lcd-content::-webkit-scrollbar {
      width: 5px;
    }
    .lcd-sidebar::-webkit-scrollbar-track,
    .lcd-content::-webkit-scrollbar-track {
      background: rgba(0,0,0,0.08);
    }
    .lcd-sidebar::-webkit-scrollbar-thumb,
    .lcd-content::-webkit-scrollbar-thumb {
      background: var(--lcd-text-dim);
      border-radius: 2px;
    }

    .sidebar-block-title {
      font-size: 11px;
      font-weight: bold;
      border-bottom: 1px dashed var(--lcd-text-dim);
      padding-bottom: 3px;
      margin-bottom: 6px;
      display: flex;
      justify-content: space-between;
      color: var(--lcd-highlight);
    }

    .sidebar-list {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .sidebar-item {
      padding: 6px 8px;
      font-size: 12px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-radius: 2px;
    }

    @media (hover: hover) and (pointer: fine) {
    .sidebar-item:hover {
      background: rgba(0,0,0,0.08);
    }
    }

    .sidebar-item.selected {
      background: var(--lcd-text);
      color: var(--lcd-bg);
      font-weight: bold;
    }

    .sidebar-item .arrow {
      opacity: 0;
    }
    .sidebar-item.selected .arrow {
      opacity: 1;
    }

    /* 右侧主内容展示区 - 严格限制在屏内滚动 */
    .lcd-content {
      padding: 16px 20px;
      height: 100%;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 14px;
      scroll-behavior: smooth;
    }

    .wiki-page {
      display: none;
      flex-direction: column;
      gap: 14px;
      animation: retroAppear 0.1s steps(2);
    }
    .wiki-page.active {
      display: flex;
    }

    @keyframes retroAppear {
      from { opacity: 0; }
      to { opacity: 1; }
    }

    /* 经典双线像素框 */
    .pixel-panel {
      border: 2px solid var(--lcd-text);
      padding: 12px 14px;
      background: rgba(0,0,0,0.03);
      position: relative;
    }

    .panel-legend {
      position: absolute;
      top: -9px;
      left: 10px;
      background: var(--lcd-bg);
      padding: 0 6px;
      font-size: 11px;
      font-weight: bold;
      color: var(--lcd-highlight);
    }

    /* 警报框 (绝版要素 / 陷阱提醒) */
    .alert-banner {
      border: 2px solid var(--lcd-text);
      background: var(--lcd-text);
      color: var(--lcd-bg);
      padding: 10px 14px;
      font-size: 12px;
      display: flex;
      gap: 12px;
      align-items: flex-start;
    }

    .alert-tag {
      background: var(--lcd-bg);
      color: var(--lcd-text);
      font-weight: 900;
      padding: 2px 6px;
      font-size: 10px;
      white-space: nowrap;
    }

    .key-notes {
      margin: 0;
      padding-left: 18px;
      line-height: 1.65;
    }

    .key-notes li + li {
      margin-top: 3px;
    }

    .location-name {
      font-weight: 900;
    }

    .coord-note {
      border: 1px solid currentColor;
      padding: 0 4px;
      font-size: 10px;
      white-space: nowrap;
      opacity: .72;
    }

    .map-location-link {
      color: inherit;
      font-size: 10px;
      font-weight: 900;
      text-decoration: underline;
      text-decoration-style: dotted;
      text-underline-offset: 2px;
      white-space: nowrap;
    }

    /* 角色卡片栅格 */
    .heroes-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
      gap: 12px;
    }

    .hero-card {
      border: 1px solid var(--lcd-text);
      background: rgba(0,0,0,0.04);
      padding: 10px;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .hero-header {
      display: flex;
      justify-content: space-between;
      border-bottom: 1px dotted var(--lcd-text-dim);
      padding-bottom: 4px;
      font-weight: bold;
    }

    .skill-tag-list {
      display: flex;
      flex-wrap: wrap;
      gap: 4px;
    }
    .skill-pill {
      font-size: 10px;
      border: 1px solid var(--lcd-text-dim);
      padding: 1px 4px;
      background: rgba(0,0,0,0.06);
    }

    /* 迷宫雷达与地图交互 */
    .tilemap-dashboard {
      display: grid;
      grid-template-columns: 1fr 230px;
      gap: 12px;
    }

    .map-frame {
      border: 2px solid var(--lcd-text);
      background: #0d140a;
      height: 270px;
      position: relative;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    #radarCanvas {
      width: 100%;
      height: 100%;
      image-rendering: pixelated;
    }

    .radar-hud {
      position: absolute;
      top: 6px;
      left: 6px;
      color: #9ec995;
      font-size: 10px;
      background: rgba(0,0,0,0.7);
      padding: 2px 6px;
      border: 1px solid #9ec995;
      pointer-events: none;
    }

    /* 坐标图层：格坐标 × 16px 线性贴合全景图 */
    .map-marker-layer {
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .map-marker {
      position: absolute;
      width: 15px;
      height: 15px;
      margin: -8px 0 0 -8px;
      padding: 0;
      border: 1px solid #0b0f08;
      border-radius: 50%;
      background: var(--marker-fill, #e0a020);
      box-shadow: 0 0 0 1px rgba(240, 246, 236, 0.75);
      cursor: pointer;
      pointer-events: auto;
      font: inherit;
      font-size: 9px;
      line-height: 1;
      color: #0b0f08;
      font-weight: 900;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .map-marker[data-kind="story"] { --marker-fill: #d8452f; color: #fdf3ef; }
    .map-marker[data-kind="exit"] { --marker-fill: #3f9f72; }
    .map-marker[data-kind="object"] { --marker-fill: #e0a020; }
    .map-marker[data-kind="npc"] { --marker-fill: #5b86b8; color: #f1f6fb; }

    .map-marker:focus-visible {
      outline: 2px solid #f4f8ee;
      outline-offset: 1px;
      z-index: var(--z-marker);
    }

    .map-marker.selected {
      outline: 3px double #f4f8ee;
      outline-offset: 2px;
      z-index: var(--z-marker-active);
    }
    @media (hover: hover) and (pointer: fine) {
    .map-marker:hover {
      outline: 2px solid #f4f8ee;
      outline-offset: 1px;
      z-index: var(--z-marker);
    }
    }

    .map-marker-pop {
      position: absolute;
      z-index: var(--z-marker-active);
      max-width: 232px;
      padding: 5px 7px;
      background: rgba(8, 13, 6, 0.94);
      border: 1px solid #9ec995;
      color: #d7ecd0;
      font-size: 10px;
      line-height: 1.5;
      pointer-events: none;
    }

    .map-marker-pop strong { color: #f2fbef; }

    .map-marker-pop .pop-source {
      display: block;
      margin-top: 3px;
      color: #8fb187;
      font-size: 9px;
      word-break: break-all;
    }

    .layer-toggle-row {
      display: flex;
      align-items: center;
      gap: 6px;
      cursor: pointer;
    }

    .layer-toggle-row input { accent-color: var(--lcd-highlight); }

    .layer-swatch {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      border: 1px solid var(--lcd-text);
      flex: none;
    }

    .layer-selector {
      border: 2px solid var(--lcd-text);
      padding: 10px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      font-size: 11px;
    }

    /* 图鉴数据表格 */
    .retro-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 11px;
      margin-top: 4px;
    }

    .retro-table th, .retro-table td {
      border: 1px solid var(--lcd-text-dim);
      padding: 6px 8px;
      text-align: left;
    }

    .retro-table th {
      background: rgba(0,0,0,0.1);
      font-weight: bold;
    }

    .retro-table tbody tr {
      cursor: pointer;
      transition: background 0.1s;
    }

    /* 列宽：名称、区域、掉落给足底宽，数值不折行，说明列吃掉剩余宽度 */
    #monsterTable th:nth-child(1), #monsterTable td:nth-child(1) { min-width: 116px; }
    #monsterTable th:nth-child(2), #monsterTable td:nth-child(2) { min-width: 104px; }
    #monsterTable td:nth-child(n+3):nth-child(-n+7) { white-space: nowrap; }
    #monsterTable th:nth-child(8), #monsterTable td:nth-child(8) { min-width: 88px; }
    #monsterTable th:nth-child(9), #monsterTable td:nth-child(9) { width: 100%; min-width: 160px; }
    #itemTable th:nth-child(1), #itemTable td:nth-child(1) { min-width: 120px; }
    #itemTable td:nth-child(2), #itemTable td:nth-child(3) { white-space: nowrap; }
    #itemTable th:nth-child(4), #itemTable td:nth-child(4) { min-width: 128px; }
    #itemTable th:nth-child(5), #itemTable td:nth-child(5) { width: 100%; min-width: 160px; }

    @media (hover: hover) and (pointer: fine) {
    .retro-table tbody tr:hover {
      background: rgba(0,0,0,0.12);
    }
    }

    .retro-table tbody tr:active {
      background: var(--lcd-text);
      color: var(--lcd-bg);
    }

    .inspect-trigger {
      appearance: none;
      width: 100%;
      border: 0;
      padding: 0;
      background: transparent;
      color: inherit;
      font: inherit;
      text-align: left;
      cursor: pointer;
      display: flex;
      align-items: center;
    }

    .inspect-trigger:focus-visible {
      outline: 2px solid var(--lcd-highlight);
      outline-offset: 2px;
    }

    .boss-tag {
      background: var(--lcd-text);
      color: var(--lcd-bg);
      font-size: 9px;
      padding: 1px 4px;
      margin-left: 4px;
      font-weight: bold;
    }

    .inspect-badge-btn {
      font-size: 10px;
      border: 1px solid var(--lcd-text);
      padding: 1px 4px;
      background: rgba(0,0,0,0.06);
      border-radius: 2px;
      display: inline-flex;
      align-items: center;
      gap: 2px;
    }

    /* 图鉴详情 (Sprite & Details Inspector Modal) */
    .sprite-inspect-modal {
      position: absolute;
      top: 32px;
      left: 8px;
      right: 8px;
      bottom: 8px;
      background: var(--lcd-bg);
      border: 3px double var(--lcd-text);
      box-shadow: 0 12px 30px rgba(0,0,0,0.6);
      z-index: var(--z-modal);
      display: none;
      flex-direction: column;
      padding: 14px 16px;
      animation: retroPopup 0.15s steps(2);
    }

    .sprite-inspect-modal.active {
      display: flex;
    }

    @keyframes retroPopup {
      from { transform: scale(0.96); opacity: 0; }
      to { transform: scale(1); opacity: 1; }
    }

    .inspect-header {
      border-bottom: 2px solid var(--lcd-text);
      padding-bottom: 6px;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .inspect-body {
      flex: 1;
      display: grid;
      grid-template-columns: 190px 1fr;
      gap: 16px;
      padding: 12px 0;
      overflow-y: auto;
    }

    .inspect-sprite-box {
      border: 2px solid var(--lcd-text);
      background: rgba(0,0,0,0.06);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 12px;
      text-align: center;
    }

    /* 卡带原生精灵立绘样式 (消除纯白背景，完美融合液晶屏幕) */
    .real-monster-thumb {
      width: 36px;
      height: 45px;
      background-image: url('/prev-versions/assets/tianlong-monsters-native.png');
      background-size: 360px 315px; /* 0.9x (400x350), 与天明图集同规格同处理 */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      display: inline-block;
      vertical-align: middle;
      margin-right: 8px;
      background-color: transparent;
    }

    .real-monster-hero-art {
      width: 80px;
      height: 100px;
      background-image: url('/prev-versions/assets/tianlong-monsters-native.png');
      background-size: 800px 700px; /* 2x */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      background-color: transparent;
      margin-bottom: 6px;
    }

    .real-item-icon {
      width: 28px;
      height: 28px;
      background-image: url('/prev-versions/assets/items-sheet.png');
      background-size: 364px 196px; /* 0.875x scale */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      display: inline-block;
      vertical-align: middle;
      margin-right: 8px;
      background-color: transparent;
    }

    /* 天明卡带原生图集（透明通道已清洗，无白块） */
    .tm-monster-thumb {
      width: 36px;
      height: 45px;
      background-image: url('/prev-versions/assets/tianming-monsters-sheet.png');
      background-size: 360px 450px; /* 0.9x (400x500) */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      display: inline-block;
      vertical-align: middle;
      margin-right: 8px;
      flex-shrink: 0;
    }

    .tm-monster-art {
      width: 80px;
      height: 100px;
      background-image: url('/prev-versions/assets/tianming-monsters-sheet.png');
      background-size: 800px 1000px; /* 2x */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      background-color: transparent;
      margin-bottom: 6px;
    }

    .tm-item-icon {
      width: 28px;
      height: 28px;
      background-image: url('/prev-versions/assets/tianming-items-sheet.png');
      background-size: 364px 392px; /* 0.875x (416x448) */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      display: inline-block;
      vertical-align: middle;
      margin-right: 8px;
      flex-shrink: 0;
    }

    .tm-item-large {
      width: 64px;
      height: 64px;
      background-image: url('/prev-versions/assets/tianming-items-sheet.png');
      background-size: 832px 896px; /* 2x */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      background-color: transparent;
      margin-bottom: 6px;
    }

    /* 天降风云录卡带原生图集（格式与天明一致：怪物 40×50 每行 10 张，道具 32×32 每行 13 张） */
    .tj-monster-thumb {
      width: 36px;
      height: 45px;
      background-image: url('/prev-versions/assets/tianjiang-monsters-sheet.png');
      background-size: 360px 450px; /* 0.9x (400x500) */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      display: inline-block;
      vertical-align: middle;
      margin-right: 8px;
      flex-shrink: 0;
    }

    .tj-monster-art {
      width: 80px;
      height: 100px;
      background-image: url('/prev-versions/assets/tianjiang-monsters-sheet.png');
      background-size: 800px 1000px; /* 2x */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      background-color: transparent;
      margin-bottom: 6px;
    }

    .tj-item-thumb {
      width: 28px;
      height: 28px;
      background-image: url('/prev-versions/assets/tianjiang-items-sheet.png');
      background-size: 364px 392px; /* 0.875x (416x448) */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      display: inline-block;
      vertical-align: middle;
      margin-right: 8px;
      flex-shrink: 0;
    }

    .tj-item-large {
      width: 64px;
      height: 64px;
      background-image: url('/prev-versions/assets/tianjiang-items-sheet.png');
      background-size: 832px 896px; /* 2x */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      background-color: transparent;
      margin-bottom: 6px;
    }

    /* 天龙剑技仙术图标 (32×32 · 卡带原生暗底) */
    .tl-skill-icon {
      width: 32px;
      height: 32px;
      background-image: url('/prev-versions/assets/tianlong-skills-sheet.png');
      background-size: 224px 160px;
      background-repeat: no-repeat;
      image-rendering: pixelated;
      display: inline-block;
      flex-shrink: 0;
      border: 1px solid var(--lcd-text-dim);
    }

    .skill-icon-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
      gap: 8px;
      margin-top: 6px;
    }

    .skill-icon-cell {
      display: flex;
      gap: 8px;
      align-items: center;
      border: 1px solid var(--lcd-text-dim);
      background: rgba(0,0,0,0.04);
      padding: 4px 6px;
    }

    /* 无图集素材时的点阵墨印占位（禁止出现纯白方块） */
    .dot-thumb {
      width: 36px;
      height: 45px;
      border: 1px solid var(--lcd-text-dim);
      background: rgba(0,0,0,0.06);
      color: var(--lcd-text);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      font-weight: 900;
      vertical-align: middle;
      margin-right: 8px;
      flex-shrink: 0;
    }

    .dot-item-icon {
      width: 28px;
      height: 28px;
      border: 1px solid var(--lcd-text-dim);
      background: rgba(0,0,0,0.06);
      color: var(--lcd-text);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      vertical-align: middle;
      margin-right: 8px;
      flex-shrink: 0;
    }

    .real-item-large {
      width: 64px;
      height: 64px;
      background-image: url('/prev-versions/assets/items-sheet.png');
      background-size: 832px 448px; /* 2x scale */
      background-repeat: no-repeat;
      image-rendering: pixelated;
      background-color: transparent;
      margin-bottom: 6px;
    }

    .real-hero-portrait {
      width: 48px;
      height: 60px;
      object-fit: contain;
      image-rendering: pixelated;
      background: transparent;
    }



    .inspect-canvas {
      width: 100px;
      height: 100px;
      image-rendering: pixelated;
      border: 1px solid var(--lcd-text-dim);
      background: transparent;
      margin-bottom: 8px;
    }

    .inspect-details {
      display: flex;
      flex-direction: column;
      gap: 10px;
      font-size: 12px;
      line-height: 1.6;
    }

    /* 伤害模拟推演器 */
    .sim-layout {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .boss-card-focus { outline: 2px solid var(--lcd-text); outline-offset: 2px; }
    .sim-control-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 12px;
      padding: 4px 0;
      border-bottom: 1px dotted var(--lcd-text-dim);
    }

    .sim-input {
      width: 80px;
      border: 1px solid var(--lcd-text);
      background: rgba(255,255,255,0.25);
      font-family: inherit;
      font-size: 12px;
      text-align: right;
      padding: 2px 4px;
      color: var(--lcd-text);
    }

    .sim-banner-result {
      grid-column: 1 / -1;
      background: var(--lcd-text);
      color: var(--lcd-bg);
      padding: 12px;
      display: flex;
      justify-content: space-around;
      text-align: center;
    }

    .stat-bignum {
      font-size: 22px;
      font-weight: 900;
      margin-top: 2px;
    }

    /* 开机演示画面框 (沿用液晶屏内嵌观感) */
    .demo-frame {
      border: 2px solid var(--lcd-text);
      border-radius: 6px;
      padding: 4px;
      background: #0d130a;
      box-shadow: inset 0 2px 8px rgba(0,0,0,0.75);
      overflow: hidden;
      margin-top: 4px;
      max-width: 480px;
    }
    .demo-frame video {
      width: 100%;
      height: auto;
      image-rendering: pixelated;
      display: block;
      background: #000;
      border-radius: 2px;
    }

    .demo-controls {
      border: 1px solid var(--lcd-text);
      padding: 6px 8px;
      background: rgba(0,0,0,0.05);
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
      font-size: 11px;
      margin-top: 8px;
      max-width: 480px;
      box-sizing: border-box;
    }
    .demo-controls .chip-btn {
      touch-action: manipulation;
      background: transparent;
      border: 1px solid var(--lcd-text);
      color: var(--lcd-text);
      font-family: inherit;
    }
    .demo-controls .chip-btn[aria-pressed="true"] {
      background: var(--lcd-text);
      color: var(--lcd-bg);
    }
    .demo-full {
      color: var(--lcd-highlight);
      font-size: 11px;
      font-weight: bold;
      text-decoration: underline;
      cursor: pointer;
      touch-action: manipulation;
      display: inline-flex;
      align-items: center;
      margin-left: auto;
    }

    /* 随身音乐盒小组件 */
    .music-player-box {
      border: 1px solid var(--lcd-text);
      padding: 6px 8px;
      background: rgba(0,0,0,0.05);
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: 11px;
    }

    .music-bars {
      display: flex;
      gap: 2px;
      align-items: flex-end;
      height: 12px;
    }
    .music-bar {
      width: 3px;
      height: 100%;
      background: var(--lcd-text);
      animation: barJump 0.6s infinite alternate ease-in-out;
    }
    .music-bar:nth-child(2) { animation-delay: 0.15s; height: 60%; }
    .music-bar:nth-child(3) { animation-delay: 0.3s; height: 80%; }
    .music-bar:nth-child(4) { animation-delay: 0.45s; height: 40%; }

    @keyframes barJump {
      from { height: 20%; }
      to { height: 100%; }
    }

    /* 系统开启「减少动态效果」时：音乐条静止、页面与弹窗不闪切、滚动不平滑 */
    @media (prefers-reduced-motion: reduce) {
      .music-bar { animation: none; }
      .wiki-page, .sprite-inspect-modal { animation: none; }
      .lcd-content { scroll-behavior: auto; }
      * { transition-duration: 0.01ms !important; }
    }

    /* 实体键盘区 */
    .device-keypad {
      margin-top: 20px;
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      gap: 24px;
      align-items: center;
      padding: 0 12px;
    }

    .dpad {
      display: grid;
      grid-template-columns: repeat(3, 38px);
      grid-template-rows: repeat(3, 38px);
      gap: 2px;
    }

    .dpad-btn {
      background: var(--case-dark);
      border: 2px solid #181d16;
      border-radius: 4px;
      color: #798375;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      box-shadow: 0 3px 0 #10140f;
    }
    .dpad-btn:active {
      transform: translateY(2px);
      box-shadow: 0 1px 0 #10140f;
    }

    .action-group {
      display: flex;
      gap: 16px;
      justify-content: flex-end;
    }

    .big-round-btn {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      background: var(--case-btn);
      border: 2px solid var(--case-border);
      box-shadow: 0 4px 0 var(--case-shadow);
      font-family: inherit;
      font-size: 13px;
      font-weight: 900;
      color: var(--case-dark);
      cursor: pointer;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }
    .big-round-btn:active {
      transform: translateY(3px);
      box-shadow: 0 1px 0 var(--case-shadow);
    }

    .keypad-guide {
      text-align: center;
      font-size: 11px;
      color: #6d7568;
      line-height: 1.6;
    }

    /* 机壳底部声明：任何屏宽都显示 */
    .device-footer {
      margin: 12px auto 0;
      max-width: 720px;
      text-align: center;
      font-size: 10px;
      line-height: 1.6;
      color: var(--case-dark);
      opacity: 0.75;
    }

    .device-footer a {
      color: inherit;
      text-decoration: underline;
    }

    .device-footer .site-contact {
      margin-left: 6px;
      white-space: nowrap;
    }

    [data-theme="dark-crt"] .device-footer {
      color: #9cb095;
      opacity: 0.8;
    }

    /* 窄屏：机壳收边、页面整体滚动、侧栏折叠、页签横向滑动 */
    .sidebar-toggle { display: none; }
    @media (max-width: 1024px) {
      body { padding: 8px; }
      .top-cartridge-shelf { flex-wrap: wrap; gap: 8px; }
      .cartridge-selector { width: 100%; }
      .cart-btn { flex: 1 1 100%; justify-content: center; }
      .noah-device { padding: 10px; border-radius: 12px; }
      .device-header { margin-bottom: 8px; gap: 8px; }
      .brand-logo { white-space: nowrap; font-size: 15px; }
      .brand-logo .sub-tag { display: none; }
      .screen-bezel { padding: 6px; }
      .lcd-screen { height: auto; min-height: 0; max-height: none; }
      .lcd-top-bar { height: auto; min-height: 28px; padding: 4px 8px; flex-wrap: wrap; gap: 4px 10px; }
      .lcd-top-bar .status-group:last-child { display: none; }
      .lcd-fkey-bar { overflow-x: auto; scrollbar-width: none; }
      .lcd-fkey-bar::-webkit-scrollbar { display: none; }
      .fkey-tab { flex: 0 0 auto; white-space: nowrap; padding: 8px 12px; }
      .lcd-viewport { display: flex; flex-direction: column; height: auto; overflow: visible; }
      .lcd-sidebar { border-right: none; border-bottom: 2px solid var(--lcd-text-dim); height: auto; overflow: visible; gap: 8px; }
      .music-player-box { display: none; }
      .sidebar-toggle {
        display: flex; justify-content: space-between; align-items: center;
        width: 100%; min-height: 40px; padding: 6px 10px;
        background: transparent; border: 2px solid var(--lcd-text); color: var(--lcd-text);
        font-family: inherit; font-size: 12px; font-weight: bold; cursor: pointer;
      }
      .lcd-sidebar .sidebar-nav { display: none; }
      .lcd-sidebar.is-open .sidebar-nav { display: block; }
      .lcd-content { height: auto; overflow: visible; padding: 12px; }
      .tilemap-dashboard { grid-template-columns: 1fr; }
      .sim-layout { grid-template-columns: 1fr; }
      .device-keypad { display: none; }
      .retro-table th:first-child, .retro-table td:first-child {
        position: sticky; left: 0; z-index: var(--z-sticky); background: var(--lcd-bg);
      }
      .retro-table th:first-child { background: var(--lcd-bg-dark); }
    }
    @media (max-width: 600px) {
      .fkey-tab .key-tag { display: none; }
    }
    /* 小笔记本窗口：双栏保留，但侧栏与留白收窄，表格不被截列 */
    @media (min-width: 1025px) and (max-width: 1240px) {
      .noah-device { padding: 16px; }
      .lcd-viewport { grid-template-columns: 216px 1fr; }
      .lcd-sidebar { padding: 8px; }
      .lcd-content { padding: 12px; }
      #monsterTable th:nth-child(9), #monsterTable td:nth-child(9) { min-width: 144px; }
    }
    .search-input {
      border: none;
      background: transparent;
      font-family: inherit;
      font-size: 11px;
      width: 100%;
      color: var(--lcd-text);
      margin-left: 4px;
    }
    /* 触控设备：可点元素最小 44px 高；输入框 16px 以免 iOS 聚焦时放大页面 */
    @media (pointer: coarse) {
      .lcd-sidebar .search-input, .lcd-content .gb-input { font-size: 16px; }
      .fkey-tab, .sidebar-item, .chip-btn, .cart-btn, .sidebar-toggle, .big-round-btn { min-height: 44px; }
      .demo-full { min-height: 44px; }
      .chip-btn { padding: 8px 12px; }
      .sidebar-item { padding-top: 10px; padding-bottom: 10px; }
      .retro-table tbody td { padding-top: 12px; padding-bottom: 12px; }
    }

    /* 留言板 */
    .guestbook-form {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-top: 10px;
      border: 2px solid var(--lcd-text);
      padding: 8px;
      background: rgba(0,0,0,0.04);
    }
    .gb-input {
      font-family: inherit;
      font-size: 11px;
      line-height: 1.6;
      color: var(--lcd-text);
      background: transparent;
      border: 2px solid var(--lcd-text);
      padding: 4px 6px;
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
    }
    textarea.gb-input { resize: vertical; }
    .gb-input::placeholder { color: var(--lcd-text-dim); }
    .gb-form-row {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }
    .gb-honeypot {
      position: absolute;
      left: -9999px;
      width: 1px;
      height: 1px;
      overflow: hidden;
    }
    .gb-entry {
      border: 1px solid var(--lcd-text-dim);
      padding: 6px 8px;
      font-size: 11px;
      line-height: 1.6;
    }
    .gb-entry-head {
      display: flex;
      align-items: center;
      gap: 6px;
      flex-wrap: wrap;
      margin-bottom: 3px;
    }
    .gb-entry-time {
      font-size: 10px;
      color: var(--lcd-text-dim);
      margin-left: auto;
    }
    .gb-entry-text { word-break: break-word; }