/* ============================================================
   全伪装：WMS 仓储「库位分布图」外壳（公共样式）
   仅五子棋使用：把棋盘伪装为内部仓储系统的库位矩阵，
   黑棋 = 已入库库位，白棋 = 已锁定库位，五连 = 连片盘点。
   仅在 html.moyu-full 下由页面 .wms-shell 渲染，非全伪装完全不受影响。
   ============================================================ */
html.moyu-full body { background: #f4f6f9; }

.wms-shell { position: fixed; inset: 0; z-index: 90; display: flex; flex-direction: column;
    background: #f4f6f9; color: #1f2329;
    font-family: 'Segoe UI','Noto Sans SC',sans-serif; font-size: 12.5px; }

/* ---- 顶部应用栏 ---- */
.wms-topbar { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 12px;
    background: #22374f; color: #e8eef5; flex-shrink: 0; }
/* 左上角「首页」入口：返回摸鱼专区 */
.wms-home { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 3px;
    color: #cfe0f0; font-size: 12px; text-decoration: none; transition: background .14s; }
.wms-home:hover { background: rgba(255,255,255,.16); color: #fff; }
.wms-logo { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px;
    border-radius: 4px; background: #2f7fd1; color: #fff; font-size: 12px; }
.wms-appname { font-size: 13.5px; font-weight: 600; color: #fff; }
.wms-appname em { font-style: normal; font-size: 11px; color: #93a7bd; margin-left: 3px; }
.wms-crumb { font-size: 12px; color: #9fb3c8; margin-left: 4px; }
.wms-crumb b { color: #e8eef5; font-weight: 600; }
.wms-topbar-right { margin-left: auto; display: flex; align-items: center; gap: 14px; font-size: 11.5px; color: #b8c8d8; }
.wms-user { display: inline-flex; align-items: center; gap: 5px; }
.wms-win { cursor: default; }
/* 右上角关闭：返回摸鱼专区 */
.wms-close { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px;
    border-radius: 3px; color: #cfe0f0; text-decoration: none; font-size: 13px; line-height: 1; }
.wms-close:hover { background: #c0392b; color: #fff; }

/* ---- 工具条 ---- */
.wms-toolbar { display: flex; align-items: center; gap: 6px; height: 42px; padding: 0 12px;
    background: #fff; border-bottom: 1px solid #e3e8ee; flex-shrink: 0; overflow: hidden; }
.wms-field { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #5b6675; white-space: nowrap; }
.wms-field i { color: #2f7fd1; font-size: 11px; }
.wms-field select { height: 26px; padding: 0 6px; border: 1px solid #d5dbe3; border-radius: 3px;
    background: #fff; color: #1f2329; font-size: 12px; cursor: pointer; }
.wms-btn { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px;
    border: 1px solid #d5dbe3; border-radius: 3px; background: #fff; color: #40506a;
    font-size: 12px; cursor: pointer; transition: all .14s; white-space: nowrap; }
.wms-btn:hover { background: #f2f5f9; border-color: #b9c3cf; }
.wms-btn:disabled { opacity: .5; cursor: not-allowed; }
.wms-btn.primary { background: #2f7fd1; border-color: #2f7fd1; color: #fff; }
.wms-btn.primary:hover { background: #286fb8; }
.wms-btn.on { background: #e6f0fb; border-color: #9cc2e8; color: #1d64a8; font-weight: 600; }
.wms-btn i { font-size: 11px; }
.wms-sep { width: 1px; height: 20px; background: #e3e8ee; margin: 0 4px; }
.wms-spacer { margin-left: auto; }

/* ---- 主体 ---- */
.wms-body { flex: 1; min-height: 0; display: flex; gap: 12px; padding: 12px; overflow: hidden; }
.wms-main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: #fff;
    border: 1px solid #e3e8ee; border-radius: 4px; overflow: hidden; }
.wms-panel-head { display: flex; align-items: center; gap: 10px; height: 36px; padding: 0 12px;
    border-bottom: 1px solid #eef1f5; background: #fafbfd; flex-shrink: 0; }
.wms-panel-head .t { font-size: 12.5px; font-weight: 600; color: #23384f; }
.wms-panel-head .t i { color: #2f7fd1; margin-right: 4px; }
.wms-panel-head .s { font-size: 11px; color: #64748b; }
.wms-boardwrap { flex: 1; min-height: 0; overflow: auto; display: flex; align-items: center;
    justify-content: center; padding: 10px; }

/* ---- 库位矩阵 ---- */
.wms-board { width: min(100%, 62vh); }
.wms-brow { display: flex; }
.wms-head .wms-corner { flex: 0 0 26px; height: 16px; }
.wms-head .wms-colh { flex: 1 1 0; margin: 0 1px; height: 16px; display: flex; align-items: center;
    justify-content: center; color: #64748b; font-size: 10px; }
.wms-axis { flex: 0 0 26px; display: flex; align-items: center; justify-content: center;
    color: #64748b; font-size: 10px; }
/* 库位单元：与真实库位图一致的小方框 */
.wms-cell { flex: 1 1 0; aspect-ratio: 1; margin: 1px; border: 1px solid #dfe4ea; border-radius: 2px;
    background: #eef1f5; position: relative; transition: background .12s, box-shadow .12s; }
.wms-cell.occ { background: #3c4a5c; border-color: #33404f; }                 /* 已入库（黑棋） */
.wms-cell.lock { background: #fff; border-color: #9aa6b5; box-shadow: inset 0 0 0 1px #dbe1e9; } /* 已锁定（白棋） */
.wms-cell.win { box-shadow: 0 0 0 2px #16a34a; z-index: 2; }                  /* 连片库位 */
.wms-cell.last::after { content: ''; position: absolute; inset: 24%; border-radius: 50%;
    border: 2px solid #f59e0b; }                                             /* 最近操作库位 */
.wms-cell.pickable { cursor: pointer; }
.wms-cell.pickable:hover { background: #e0e8f2; border-color: #9cc2e8; }
html.moyu-full .wms-cell.last { cursor: default; }

/* ---- 侧栏 ---- */
.wms-aside { flex: 0 0 268px; display: flex; flex-direction: column; gap: 12px; overflow: auto; }
.wms-card { background: #fff; border: 1px solid #e3e8ee; border-radius: 4px; }
.wms-card-h { display: flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px;
    border-bottom: 1px solid #eef1f5; font-size: 12.5px; font-weight: 600; color: #23384f; }
.wms-card-h i { color: #2f7fd1; font-size: 11px; }
.wms-card-b { padding: 8px 12px; }
.wms-kv { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; font-size: 12px;
    border-bottom: 1px dashed #f0f3f7; }
.wms-kv:last-child { border-bottom: 0; }
.wms-kv .k { color: #8a94a6; }
.wms-kv .v { color: #1f2329; font-weight: 600; font-variant-numeric: tabular-nums; }
.wms-kv .v.blue { color: #1d64a8; }
.wms-kv .v.green { color: #1a7f4b; }
.wms-legend { display: flex; flex-direction: column; gap: 9px; padding: 10px 12px; }
.wms-lg { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #40506a; }
.wms-swatch { width: 15px; height: 15px; border-radius: 2px; border: 1px solid #dfe4ea;
    background: #eef1f5; flex-shrink: 0; }
.wms-swatch.occ { background: #3c4a5c; border-color: #33404f; }
.wms-swatch.lock { background: #fff; border-color: #9aa6b5; }
.wms-swatch.win { box-shadow: 0 0 0 2px #16a34a; }
.wms-swatch.last { position: relative; }
.wms-swatch.last::after { content: ''; position: absolute; inset: 22%; border-radius: 50%; border: 2px solid #f59e0b; }

/* ---- 状态栏 ---- */
.wms-statusbar { display: flex; align-items: center; gap: 18px; height: 24px; padding: 0 12px;
    background: #eef1f5; border-top: 1px solid #e3e8ee; color: #5b6675; font-size: 11px; flex-shrink: 0; }
.wms-statusbar .r { margin-left: auto; display: flex; gap: 14px; }