/* =====================================================================
 * 46 行李寄存指南 · 视觉母题「行李箱轮廓 + 柜格矩阵」
 * ---------------------------------------------------------------------
 * 色板：行李棕（--lg-pri #7a5a3a）+ 铜扣金（--lg-hot），沉稳暖棕。
 * 版式：F 表格主导 —— 首屏即对照表，行内即时算，右侧固定结论卡。
 * 本页只作用于 .b11--locker 容器，不外溢到其它任何页面。
 * ===================================================================== */

.b11--locker {
    --lg-pri: #7a5a3a;
    --lg-pri2: #9d7a52;
    --lg-hot: #c39a4e;
    --lg-tint: #efe4d6;
    --b11-pri: #7a5a3a;
    --b11-pri2: #9d7a52;
    --b11-tint: #efe4d6;
    --b11-bg: #f1ede7;
    --b11-bg2: #e4ddd2;
    --b11-card2: #faf7f2;
    background-image:
        linear-gradient(to bottom, color-mix(in srgb, var(--b11-line2) 26%, transparent) 1px, transparent 1px);
    background-size: 100% 12px;
}
:root[data-theme="dark"] .b11.b11--locker {
    --lg-pri: #b3906a;
    --lg-pri2: #cbaa82;
    --lg-hot: #d9b473;
    --lg-tint: #2a2118;
    --b11-pri: #b3906a;
    --b11-pri2: #cbaa82;
    --b11-tint: #2a2118;
    --b11-bg: #131110;
    --b11-bg2: #1d1a17;
    --b11-card2: #211d19;
}

/* ---------- 首屏 ---------- */
.lg-hero { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 28px; align-items: center; }
.lg-hero .b11-h1 em { color: var(--lg-pri); }
.lg-hero .b11-lead b { box-shadow: inset 0 -.42em 0 var(--lg-tint); }
.lg-case { display: grid; place-items: center; }
.lg-case svg { width: min(260px, 76vw); height: auto; }

/* ---------- 表格主导布局 ---------- */
.lg-board { margin-top: 26px; }
.lg-layout { display: grid; grid-template-columns: minmax(0, 1fr) 286px; gap: 18px; align-items: start; }
.lg-tablewrap { min-width: 0; }
.lg-table { min-width: 900px; }
.lg-table td { vertical-align: middle; }
.lg-table .b11-inp { padding: 6px 8px; font-size: var(--b11-sm); min-width: 74px; }
.lg-table .num .b11-inp { text-align: right; }
.lg-scene-name { display: block; font-size: var(--b11-sm); font-weight: 750; color: var(--b11-ink); white-space: nowrap; }
.lg-mode { display: inline-block; font-family: var(--b11-mono); font-size: 11px; color: var(--lg-pri); background: var(--lg-tint); padding: 1px 7px; }
.lg-cost { font-family: var(--b11-mono); font-weight: 800; color: var(--lg-pri); font-size: var(--b11-base); white-space: nowrap; }
.lg-cost.zero { color: var(--b11-mute); font-weight: 400; }
.lg-cost.over { color: var(--b11-bad); }
.lg-row-on { background: var(--lg-tint) !important; }

/* ---------- 右侧结论卡 ---------- */
.lg-side {
    position: sticky; top: 18px; background: var(--b11-card); border: 1px solid var(--b11-line);
    border-top: 4px solid var(--lg-pri); padding: 18px 18px 16px; box-shadow: var(--b11-shadow);
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}
.lg-side-t { font-size: var(--b11-sm); font-weight: 800; letter-spacing: .1em; color: var(--lg-pri); padding-bottom: 9px; border-bottom: 1px solid currentColor; margin-bottom: 12px; }
.lg-total { background: var(--lg-tint); padding: 12px 14px; margin-bottom: 12px; }
.lg-total-l { display: block; font-size: var(--b11-xs); color: var(--b11-mute); }
.lg-total-v { display: block; font-family: var(--b11-mono); font-size: var(--b11-num); font-weight: 800; color: var(--lg-pri); line-height: 1.2; margin: 4px 0 2px; }
.lg-total-s { display: block; font-size: var(--b11-xs); color: var(--b11-sub); }
.lg-side-list { list-style: none; margin: 0; padding: 0; }
.lg-side-list li {
    position: relative; padding: 7px 0 7px 20px; font-size: var(--b11-sm); color: var(--b11-sub);
    border-bottom: 1px dotted var(--b11-line2); line-height: 1.68;
}
.lg-side-list li:last-child { border-bottom: 0; }
.lg-side-list li::before {
    content: "▸"; position: absolute; left: 0; top: 7px; color: var(--lg-hot); font-size: 12px; font-weight: 800;
}
.lg-side-list li b { color: var(--b11-ink); }

/* ---------- 结果读数 ---------- */
.lg-readout { display: grid; gap: 10px; margin-bottom: var(--b11-gap); }
.lg-readout .b11-readout-row { border-left: 3px solid var(--lg-pri); }
.lg-readout .b11-readout-row.is-hot { background: var(--lg-tint); border-color: transparent; border-left-color: var(--lg-hot); }
.lg-readout .b11-readout-row.is-hot .vl { color: var(--lg-pri); }
.lg-readout .b11-readout-row.is-bad { background: var(--b11-badbg); border-color: transparent; border-left-color: var(--b11-bad); }
.lg-readout .b11-readout-row.is-bad .vl { color: var(--b11-bad); }

/* ---------- 比价与提示 ---------- */
.lg-compare, .lg-notes { list-style: none; margin: 0; padding: 0; }
.lg-compare li, .lg-notes li {
    position: relative; padding: 8px 0 8px 26px; font-size: var(--b11-sm); color: var(--b11-sub);
    border-bottom: 1px dotted var(--b11-line2); line-height: 1.72;
}
.lg-compare li:last-child, .lg-notes li:last-child { border-bottom: 0; }
.lg-compare li::before {
    content: "¥"; position: absolute; left: 0; top: 8px; width: 18px; height: 18px;
    display: grid; place-items: center; background: var(--lg-tint); color: var(--lg-pri);
    font-family: var(--b11-mono); font-size: 11px; font-weight: 800;
}
.lg-compare li.best::before { background: var(--lg-pri); color: #fff; }
.lg-notes li::before {
    content: "!"; position: absolute; left: 0; top: 8px; width: 18px; height: 18px;
    display: grid; place-items: center; background: var(--b11-warnbg); color: var(--b11-warn);
    font-size: 11px; font-weight: 800;
}
.lg-compare li b, .lg-notes li b { color: var(--b11-ink); }

/* ---------- 批量清洗条 ---------- */
.lg-clean {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
    margin-top: 14px; padding: 12px 14px; background: var(--b11-card2);
    border: 1px solid var(--b11-line); font-size: var(--b11-sm);
}
.lg-clean > b { color: var(--lg-pri); font-family: var(--b11-mono); font-size: var(--b11-xs); letter-spacing: .08em; }
.lg-clean code { margin-left: auto; }

/* ---------- 响应式 ---------- */
@media (max-width: 980px) {
    .lg-layout { grid-template-columns: minmax(0, 1fr); }
    .lg-side { position: static; }
}
@media (max-width: 900px) {
    .lg-hero { grid-template-columns: minmax(0, 1fr); }
    .lg-case { order: -1; }
    .lg-clean code { margin-left: 0; }
}
