.lb, .lb-tooltip, .lb-drawer { --lb-accent: #ed862b; --lb-ok: #ed862b; --lb-editor-border: #ed862b; --background-color-progressive: #c75708; --background-color-progressive--hover: #aa4704; --lb-line: var(--border-color-base, #3a3a3e); --lb-tile: var(--color-surface-1, #1c1c1f); --lb-raise: var(--color-surface-2, #26262a); --lb-muted: var(--color-subtle, #96969c); font-family: var(--font-family-base, inherit); color: var(--color-base); margin-top: 8px; }
.lb img { -webkit-user-drag: none; user-select: none; pointer-events: none; }
.lb button, .lb-drawer button, .lb-drawer select { font-family: inherit; color: inherit; cursor: pointer; }
.lb-slots { display: grid; grid-template-columns: 1.6fr 1.6fr 1fr 1fr 1fr; gap: 8px; position: relative; z-index: 1; }
.lb-slot { background: var(--lb-tile); border: 1px solid var(--lb-line); border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 2px; text-align: left; min-width: 0; }
.lb-slot small { font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: normal; text-transform: none; color: var(--lb-muted); }
.lb-slot strong { font-size: 14px; font-weight: 600; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb-slot .lb-pic { height: 56px; }
.lb-slot:hover { border-color: var(--lb-accent); background: var(--lb-raise); }
.lb-slot[aria-selected="true"] { background: var(--lb-raise); border-color: var(--lb-accent); border-bottom-color: var(--lb-raise); border-radius: 10px 10px 0 0; margin-bottom: -1px; padding-bottom: 13px; }
.lb-slot[aria-selected="true"] small { color: var(--lb-accent); }
.lb-pic { display: flex; align-items: center; justify-content: center; min-width: 0; }
.lb-pic img { max-width: 100%; max-height: 100%; object-fit: contain; }
.lb-pic.lb-w img { mix-blend-mode: lighten; }
.skin-theme-clientpref-day .lb-slot .lb-w, .skin-theme-clientpref-day .lb-item .lb-w, .skin-theme-clientpref-day .lb-opt .lb-w { background: #222225; border-radius: 6px; }
.lb-noimg { font-size: 11px; color: var(--lb-muted); border: 1px dashed var(--lb-line); border-radius: 6px; padding: 2px 6px; white-space: nowrap; }
.lb-ed { background: var(--lb-raise); border: 1px solid var(--lb-editor-border); border-radius: 0 10px 10px 10px; padding: 16px; overflow: clip; isolation: isolate; }
.lb-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.lb-head small { display: block; font-size: 12px; line-height: 1.4; letter-spacing: normal; text-transform: none; color: var(--lb-muted); font-weight: 500; }
.lb-head strong { font-size: 20px; font-weight: 600; line-height: 1.4; color: var(--color-emphasized); }
.lb-actions { display: flex; gap: 8px; align-items: center; }
.lb-btn { background: var(--lb-tile); border: 1px solid var(--lb-line); border-radius: 6px; padding: 8px 12px; min-height: 40px; box-sizing: border-box; font-size: 14px; line-height: 20px; white-space: nowrap; }
.lb-btn:hover { border-color: var(--lb-accent); background: var(--lb-raise); }
.lb-btn-main { background: var(--background-color-progressive, var(--bc-red)); border-color: var(--background-color-progressive, var(--bc-red)); color: #fff !important; font-weight: 600; }
.lb-btn-main:hover { background: var(--background-color-progressive--hover, var(--bc-red-hover)); border-color: var(--background-color-progressive--hover, var(--bc-red-hover)); }
.lb :is(button, input):focus-visible, .lb-drawer :is(button, input, select):focus-visible { outline: 2px solid var(--lb-accent); outline-offset: 3px; }
.lb-body { display: grid; grid-template-columns: minmax(0, 1fr) 272px; grid-template-areas: "preview stats" "parts parts"; gap: 16px; align-items: start; }
.lb-stage { grid-area: preview; min-height: 340px; border-radius: 10px; display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; }
.lb-stage .lb-pic { width: 100%; height: 380px; }
.lb-stack { position: relative; display: block; }
.lb-stack img { position: absolute; height: auto; }
.lb-stage-wrap { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.lb-zoomport { position: relative; display: block; max-width: 100%; overflow: visible; touch-action: pan-y; user-select: none; }
.lb-zoomport .lb-stack { transform-origin: 0 0; }
.lb-zoomport.lb-zoomed { cursor: move; touch-action: none; }
.lb-spinnable .lb-zoomport { cursor: grab; }
.lb-spinnable .lb-zoomport:active { cursor: grabbing; }
.lb-spinnable .lb-zoomport.lb-zoomed { cursor: move; }
.lb-spinnable:focus-visible { outline: 1px solid var(--lb-muted); outline-offset: 4px; border-radius: 6px; }
.lb-frame { position: absolute; overflow: hidden; display: block; }
.lb-frame img { position: absolute; max-width: none; height: auto; }
.lb-stage-note { font-size: 12px; color: var(--lb-muted); text-align: center; }
.lb-stage .lb-noimg { font-size: 14px; color: var(--lb-muted); border-color: var(--lb-line); }
.lb-list { grid-area: parts; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: start; }
.lb-row { min-width: 0; }
.lb-row-open { grid-column: 1 / -1; }
.lb-head, .lb-list, .lb-status { position: relative; z-index: 1; }
.lb-item { display: grid; grid-template-columns: 52px 1fr 14px; gap: 8px; align-items: center; background: var(--lb-tile); border: 1px solid var(--lb-line); border-radius: 8px; padding: 6px 12px 6px 8px; box-sizing: border-box; min-height: 52px; font-size: 14px; line-height: 1.4; text-align: left; width: 100%; }
.lb-item .lb-pic { width: 52px; height: 32px; }
.lb-item b { display: block; font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: normal; text-transform: none; color: var(--lb-muted); }
.lb-item span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.lb-item i { color: var(--lb-muted); font-style: normal; }
.lb-item:hover { border-color: var(--lb-accent); background: var(--lb-raise); }
.lb-open { border: 1px solid var(--lb-accent); border-top: none; border-radius: 0 0 8px 8px; padding: 10px; background: var(--lb-tile); }
.lb-filter { width: 100%; box-sizing: border-box; margin-bottom: 8px; padding: 10px 12px; min-height: 44px; border-radius: 6px; border: 1px solid var(--lb-line); background: var(--lb-raise); color: inherit; font: inherit; font-size: 14px; }
.lb-opts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; max-height: 420px; overflow-y: auto; overscroll-behavior: contain; }
.lb-opt { background: var(--lb-raise); border: 1px solid var(--lb-line); border-radius: 8px; padding: 24px 8px 10px; font-size: 13px; line-height: 1.4; position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.lb-opt .lb-pic { width: 100%; height: 34px; }
.lb-opt span { overflow-wrap: anywhere; }
.lb-opt:hover { border-color: var(--lb-accent); background: var(--lb-tile); }
.lb-status { min-height: 1.2em; font-size: 13px; color: var(--lb-muted); margin: 8px 0 0; text-align: right; }
@media (max-width: 860px) {
  .lb-slots { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lb-slot[aria-selected="true"] { border-radius: 10px; border-bottom-color: var(--lb-accent); margin-bottom: 0; padding-bottom: 12px; }
  .lb-ed { border-radius: 10px; margin-top: 8px; padding: 12px; }
  .lb-body { grid-template-columns: 1fr; grid-template-areas: "preview" "stats" "parts"; }
  .lb-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-opts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lb-stage { position: static; min-height: 240px; height: auto; }
  .lb-stage .lb-pic { height: 190px; }
}
@media (max-width: 480px) {
  .lb-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-list { grid-template-columns: minmax(0, 1fr); }
  .lb-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.lb-stack > canvas { display: block; width: 100%; height: 100%; }

.lb-actions { flex-wrap: wrap; }
.lb-btn:disabled { opacity: .4; cursor: default; }
.lb-view-tools { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px; position: relative; z-index: 2; width: max-content; max-width: 100%; padding: 5px; border: 1px solid var(--lb-line); border-radius: 10px; background: var(--lb-tile); }
.lb-view-btn { border: 0; border-radius: 6px; background: transparent; min-width: 34px; min-height: 34px; padding: 4px 8px; font-size: 16px; }
.lb-view-btn:hover { background: var(--lb-raise); color: var(--lb-accent); }
.lb-angle-value, .lb-zoom-value { min-width: 38px; text-align: center; font-size: 12px; font-variant-numeric: tabular-nums; color: var(--lb-muted); }
.lb-tool-divider { height: 20px; width: 1px; background: var(--lb-line); margin: 0 3px; }
.lb-options-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.lb-options-head > strong { font-size: 14px; }
.lb-empty { grid-column: 1 / -1; padding: 18px; text-align: center; color: var(--lb-muted); font-size: 14px; }
.lb-option-effects { display: flex !important; flex-direction: column; gap: 3px; min-height: 32px; margin-top: 5px; }
.lb-effect { font-size: 10px; line-height: 1.35; }
.lb-effect-good, .lb-impact-good strong { color: #75d5a0; }
.lb-effect-bad, .lb-impact-bad strong { color: #f09baa; }
.lb-effect-neutral { color: var(--lb-muted); }
.lb-stats-panel { grid-area: stats; position: relative; top: auto; z-index: 2; min-width: 0; padding: 16px; border: 1px solid var(--lb-accent); border-radius: 12px; background: var(--lb-tile); box-shadow: 0 10px 28px #00000018; max-height: calc(100vh - 48px); overflow-y: auto; scrollbar-width: thin; box-sizing: border-box; }
.lb-stats-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 14px; }
.lb-stats-heading small, .lb-inspection > small { color: var(--lb-muted); font-size: 11px; }
.lb-stats-heading h2 { font-size: 21px; line-height: 1.2; margin: 3px 0 0; border: 0; font-weight: 650; }
.lb-stats-badge { font-size: 10px; border: 1px solid var(--lb-line); color: var(--lb-accent); border-radius: 20px; padding: 3px 7px; margin-top: 4px; }
.lb-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding-bottom: 16px; border-bottom: 1px solid var(--lb-line); }
.lb-metric { display: flex; flex-direction: column; min-width: 0; gap: 3px; }
.lb-metric small { font-size: 10px; color: var(--lb-muted); }
.lb-metric strong { font-size: 22px; font-weight: 650; font-variant-numeric: tabular-nums; line-height: 1.2; }
.lb-metric > span { font-size: 10px; color: var(--lb-muted); }
.lb-build-impact, .lb-inspection { margin-top: 16px; }
.lb-build-impact h3, .lb-inspection h3 { font-size: 14px; line-height: 1.35; margin: 0 0 4px; font-weight: 600; }
.lb-inspection { padding: 12px; border-radius: 8px; background: color-mix(in srgb, var(--lb-accent) 8%, var(--lb-tile)); border: 1px solid color-mix(in srgb, var(--lb-accent) 40%, var(--lb-line)); }
.lb-inspection > p, .lb-section-caption { font-size: 11px; color: var(--lb-muted); margin: 2px 0 10px; line-height: 1.5; }
.lb-impact-list { list-style: none; padding: 0; margin: 10px 0 0; }
.lb-impact-list li { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; line-height: 1.4; padding: 7px 0; border-bottom: 1px solid color-mix(in srgb, var(--lb-line) 60%, transparent); }
.lb-impact-list li:last-child { border-bottom: 0; }
.lb-impact-list strong { font-variant-numeric: tabular-nums; white-space: nowrap; }
.lb-stats-empty { font-size: 12px; color: var(--lb-muted); line-height: 1.5; padding: 12px 0; margin: 0; }
.lb-changed-parts { border-top: 1px solid var(--lb-line); padding-top: 12px; margin-top: 12px; font-size: 12px; }
.lb-changed-parts summary { cursor: pointer; color: var(--lb-accent); }
.lb-changed-parts ul { list-style: none; padding: 0; margin: 10px 0 0; }
.lb-changed-parts li { display: flex; flex-direction: column; padding: 8px 0; gap: 2px; }
.lb-changed-parts b { font-size: 11px; color: var(--lb-muted); }
.lb-part-removed { color: var(--lb-muted); }
.lb-part-added { color: var(--color-base); }
.lb-stats-source { font-size: 10px; color: var(--lb-muted); margin: 16px 0 0; padding-top: 12px; border-top: 1px solid var(--lb-line); line-height: 1.5; }
.lb-stats-source a { color: var(--lb-accent); }
.lb-mount-warning { color: var(--lb-accent); font-size: 11px; line-height: 1.45; margin: 10px 0 0; }
.lb-tooltip { position: fixed; z-index: 10000; width: 280px; max-width: calc(100vw - 24px); max-height: calc(100vh - 24px); overflow-y: auto; box-sizing: border-box; margin: 0; padding: 14px 16px; border: 1px solid var(--lb-accent); border-radius: 12px; background: var(--lb-tile); box-shadow: 0 12px 40px #0006; pointer-events: auto; }
.lb-tooltip[hidden] { display: none; }
.lb-tooltip > small { font-size: 10px; color: var(--lb-muted); }
.lb-tooltip-title { display: block; font-size: 15px; margin: 3px 0 8px; }
.skin-theme-clientpref-day :is(.lb-effect-good, .lb-impact-good strong) { color: #177448; }
.skin-theme-clientpref-day :is(.lb-effect-bad, .lb-impact-bad strong) { color: #b32b46; }
@media (max-width: 960px) {
  .lb-body { grid-template-columns: minmax(0, 1fr); grid-template-areas: "preview" "stats" "parts"; }
  .lb-stats-panel { position: relative; top: auto; max-height: none; }
  .lb-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .lb-actions { gap: 6px; }
  .lb-actions .lb-btn { padding: 7px 9px; font-size: 12px; }
  .lb-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-view-btn { min-height: 40px; }
}

/* Attachment browser: fixed overlay, never inserted into the page layout. */
.lb-drawer { position: fixed; bottom: 12px; z-index: 9000; margin: 0; padding: 16px; box-sizing: border-box; height: min(46dvh, 430px); min-height: min(300px, 78dvh); max-height: calc(100dvh - 24px); display: flex; flex-direction: column; gap: 12px; border: 1px solid var(--lb-accent); border-top: 3px solid var(--lb-accent); border-radius: 16px; background: var(--lb-tile); box-shadow: 0 -10px 60px #0007; animation: lb-drawer-enter 150ms ease-out; }
.lb-drawer[hidden] { display: none; }
.lb-drawer.lb-drawer-expanded { height: min(78dvh, 800px); }
.lb-drawer-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: 0 0 auto; }
.lb-drawer-heading small { color: var(--lb-muted); font-size: 11px; }
.lb-drawer-heading h2 { margin: 2px 0 0; font-size: 20px; line-height: 1.2; border: 0; }
.lb-drawer-actions { display: flex; gap: 8px; }
.lb-drawer-tools { display: grid; grid-template-columns: minmax(110px, 170px) minmax(0, 1fr) auto; gap: 10px; align-items: center; flex: 0 0 auto; }
.lb-drawer-tools .lb-filter { margin: 0; }
.lb-drawer-category { min-width: 0; width: 100%; min-height: 44px; padding: 8px; font: inherit; font-size: 13px; border: 1px solid var(--lb-line); border-radius: 6px; background: var(--lb-raise); color: inherit; }
.lb-drawer-category option { background: var(--lb-tile); color: var(--color-base); }
.lb-drawer-count { color: var(--lb-muted); font-size: 11px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lb-drawer-content { display: grid; grid-template-columns: minmax(0, 1fr) 225px; gap: 16px; min-height: 0; flex: 1; }
.lb-drawer .lb-opts { min-height: 0; max-height: none; height: 100%; grid-template-columns: repeat(auto-fill, minmax(125px, 1fr)); align-content: start; padding: 3px; box-sizing: border-box; scrollbar-width: thin; }
.lb-drawer .lb-opt { color: inherit; font: inherit; font-size: 12px; min-height: 136px; }
.lb-drawer .lb-opt .lb-pic { height: 44px; }
.lb-drawer .lb-opt img { max-height: 44px; pointer-events: none; }
.lb-drawer .lb-opt .lb-effect { font-size: 10px; }
.lb-drawer-comparison { overflow-y: auto; overscroll-behavior: contain; min-height: 0; padding: 12px; border: 1px solid var(--lb-line); border-radius: 8px; background: var(--lb-raise); scrollbar-width: thin; }
.lb-drawer-comparison > small { color: var(--lb-muted); font-size: 11px; }
.lb-drawer-comparison h3 { margin: 5px 0 10px; font-size: 16px; }
@keyframes lb-drawer-enter { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 760px) {
  .lb-drawer { padding: 12px; height: 52dvh; gap: 10px; }
  .lb-drawer-content { grid-template-columns: minmax(0, 1fr); }
  .lb-drawer-comparison { display: none; }
  .lb-drawer-tools { grid-template-columns: minmax(90px, 0.8fr) minmax(0, 1.2fr); gap: 8px; }
  .lb-drawer-count { display: none; }
  .lb-drawer-heading h2 { font-size: 17px; }
  .lb-drawer-actions { gap: 6px; }
  .lb-drawer .lb-btn { padding: 7px 10px; font-size: 12px; }
  .lb-drawer .lb-opts { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
}
@media (prefers-reduced-motion: reduce) { .lb-drawer { animation: none; } }

/* Three attachment lanes and a screen-right expanded browser. */
@media (min-width: 761px) { .lb-list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.lb-drawer .lb-opts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lb-drawer.lb-drawer-expanded { top: 12px; bottom: 12px; height: calc(100dvh - 24px); max-height: none; }
.lb-drawer-expanded .lb-drawer-content { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; }
.lb-drawer-expanded .lb-drawer-comparison { max-height: 155px; }
.lb-drawer-expanded .lb-impact-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.lb-is-locked { position: relative; cursor: not-allowed !important; background: #151518 !important; border-color: var(--lb-line) !important; }
.lb-is-locked > :not(.lb-pic):not(.lb-lock):not(.lb-lock-note) { visibility: hidden; }
.lb-is-locked .lb-pic { opacity: .5; filter: none; }
.lb-opt.lb-is-locked::before { display: none; }
.lb-lock { position: absolute; left: 50%; top: 50%; width: 24px; height: 28px; transform: translate(-50%,-50%); pointer-events: none; }
.lb-lock::before { content: ''; position: absolute; left: 5px; top: 0; width: 14px; height: 16px; border: 3px solid #b5b2ae; border-radius: 8px 8px 0 0; box-sizing: border-box; }
.lb-lock::after { content: ''; position: absolute; left: 1px; bottom: 0; width: 22px; height: 17px; border-radius: 4px; background: #b5b2ae; }
@media (max-width: 480px) { .lb-drawer .lb-opt { padding-left: 4px; padding-right: 4px; font-size: 11px; } .lb-drawer-tools { grid-template-columns: 95px minmax(0,1fr); } }

@media (min-width: 761px) {
  .lb-item { grid-template-columns: 32px minmax(0, 1fr) 10px; gap: 6px; padding: 8px; min-height: 64px; font-size: 12px; }
  .lb-item .lb-pic { width: 32px; }
  .lb-item b { font-size: 11px; }
  .lb-item > span:not(.lb-pic):not(.lb-lock) { white-space: normal; overflow-wrap: anywhere; }
}

/* Fit the expanded picker into the empty gutter outside the article. */
.lb-drawer-docked { padding: 12px; gap: 10px; }
.lb-drawer-docked .lb-drawer-heading { flex-wrap: wrap; }
.lb-drawer-docked .lb-drawer-actions { margin-left: auto; }
.lb-drawer-docked .lb-drawer-heading h2 { font-size: 18px; }
.lb-drawer-docked .lb-drawer-tools { grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.lb-drawer-docked .lb-drawer-category { grid-column: 1 / -1; }
.lb-drawer-docked .lb-opts { gap: 6px; }
.lb-drawer-docked .lb-opt { min-width: 0; padding: 8px 3px; font-size: 11px; overflow-wrap: anywhere; }
.lb-drawer-docked .lb-opt .lb-effect { font-size: 9px; }
.lb-drawer-docked .lb-impact-list { grid-template-columns: minmax(0, 1fr); }

/* Quiet controls and an always-expanded side browser. */
.lb-item { grid-template-columns: 52px minmax(0,1fr); }
@media (min-width: 761px) { .lb-item { grid-template-columns: 32px minmax(0,1fr); } }
.lb-drawer.lb-drawer-expanded { min-height: 0; }
.lb-drawer-close { flex: 0 0 36px; width: 36px; height: 36px; padding: 0 !important; font-size: 18px !important; display: grid; place-items: center; border-radius: 50%; }
.lb-drawer .lb-opt { padding: 12px 6px; min-height: 112px; }
.lb-drawer-comparison[hidden] { display: none; }
.lb-stats-panel, .lb-stats-panel h2, .lb-stats-panel strong { font-family: "Segoe UI", Arial, sans-serif; }
.lb-stats-panel { padding: 20px; }
.lb-stats-heading { margin-bottom: 20px; }
.lb-stats-heading h2 { font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.lb-metrics { padding-bottom: 0; border-bottom: 0; gap: 12px; }
.lb-metric small { font-size: 11px; }
.lb-metric strong { font-size: 25px; font-weight: 500; letter-spacing: -.035em; }
.lb-category-picker { position: relative; min-width: 0; grid-column: 1 / -1; }
.lb-category-picker summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; list-style: none; cursor: pointer; padding: 12px 14px; border: 1px solid var(--lb-line); border-radius: 8px; background: var(--lb-raise); font-size: 13px; }
.lb-category-picker summary::-webkit-details-marker { display: none; }
.lb-category-picker summary small { color: var(--lb-muted); font-size: 10px; }
.lb-category-picker summary:focus-visible { outline: 2px solid var(--lb-accent); outline-offset: 2px; }
.lb-category-picker[open] summary { border-color: var(--lb-accent); }
.lb-category-grid { position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 3; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; max-height: min(440px,55dvh); overflow-y: auto; overscroll-behavior: contain; padding: 10px; border: 1px solid var(--lb-line); border-radius: 12px; background: var(--lb-tile); box-shadow: 0 14px 36px #0007; scrollbar-width: thin; }
.lb-category-option { position: relative; min-height: 40px; min-width: 0; border: 1px solid transparent; border-radius: 7px; background: var(--lb-raise); padding: 9px 10px; text-align: left; font: inherit; font-size: 12px; line-height: 1.3; }
.lb-category-option:hover { border-color: var(--lb-accent); }
.lb-category-option[aria-current="true"] { color: var(--lb-accent); }
.lb-category-option .lb-lock { transform: translate(-50%,-50%) scale(.65); }

.lb-drawer .lb-opt { height: max-content; align-self: start; }
.lb-drawer .lb-opt > * { flex-shrink: 0; }
.lb-drawer .lb-option-effects { min-height: 0; }

/* Numeric current-to-selected comparisons live only in the hover tooltip. */
.lb-drawer-expanded .lb-drawer-content { grid-template-rows: minmax(0, 1fr); }
.lb-tooltip { width: 340px; }
.lb-tooltip .lb-impact-list li { align-items: baseline; }
.lb-tooltip .lb-impact-list strong { font-weight: 600; }

/* Compact heading and the same single-border focus treatment as site search. */
.lb-drawer-heading .lb-category-picker { flex: 1; }
.lb-drawer-docked .lb-drawer-heading { flex-wrap: nowrap; }
.lb-drawer .lb-drawer-tools { grid-template-columns: minmax(0,1fr) auto; }
.lb-drawer .lb-filter:focus, .lb-drawer .lb-filter:focus-visible { outline: none; box-shadow: none; border-color: var(--color-progressive); }

/* Hide the controls without moving the preview or changing its zoom/angle. */
.lb-controls-hidden .lb-identity, .lb-controls-hidden .lb-build-actions, .lb-controls-hidden .lb-list, .lb-controls-hidden .lb-view-tools, .lb-controls-hidden .lb-status, .lb-controls-hidden .lb-stats-panel { visibility: hidden; pointer-events: none; }
.lb-controls-hidden .lb-stats-panel { border-color: transparent; background: transparent; box-shadow: none; overflow: visible; }

/* Compact equipment choices sit directly beneath the equipment card. */
@media (min-width: 961px) {
  .lb-equipment .lb-body { grid-template-areas: "preview stats" "preview parts"; grid-template-rows: auto 1fr; }
  .lb-equipment .lb-list { grid-template-columns: minmax(0,1fr); }
}

/* Keep only actual metrics in the card, with a separate control when none exist. */
.lb-stats-panel{padding-top:36px}
.lb-stats-panel.lb-stats-none{border:0;background:transparent;box-shadow:none;padding:0;min-height:36px;max-height:none;overflow:visible}
.lb-compare-add{padding:7px 12px;flex:0 0 auto}

/* One continuous scene covers the editor, including the space behind controls. */
.lb-ed{position:relative}
.lb-live-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;touch-action:none;outline:none;cursor:grab}
.lb-live-canvas:active{cursor:grabbing}
.lb-stage{position:static;pointer-events:none;min-height:240px;padding:8px}
.lb-live-port{width:100%;height:clamp(170px,calc(100dvh - 620px),330px);pointer-events:none}
.lb-live-placeholder{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;z-index:1}
.lb-view-tools,.lb-load-error{pointer-events:auto}
.lb-load-error:empty{display:none}
.lb-load-error{position:relative;z-index:2;color:var(--lb-muted)}
.lb-head,.lb-list,.lb-status{z-index:2}
@media(min-width:961px){.lb-slot{padding:8px 10px}.lb-slot[aria-selected="true"]{padding-bottom:9px}.lb-slot .lb-pic{height:40px}.lb-stage{min-height:225px}.lb-item{min-height:54px}.lb-body{gap:12px}.lb-live-port{height:clamp(170px,calc(100dvh - 565px),380px)}}
@media(max-width:960px){.lb-live-port{height:220px}.lb-live-canvas{max-width:100%}.lb-slot .lb-pic{height:36px}}

@media(min-width:961px) and (max-height:800px){.lb-stage{min-height:202px}.lb-live-port{height:145px}.lb-item{min-height:50px}.lb-body{gap:8px}.lb-ed{padding:12px}}

.lb-actions .lb-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px}.lb-icon-button{width:34px;padding:7px!important;color:var(--lb-accent)}.lb-icon-button:disabled{opacity:.3;cursor:default}
.lb-action-icon{display:inline-block;width:18px;height:18px;background:currentColor;mask-position:center;mask-size:contain;mask-repeat:no-repeat;flex:none}.lb-undo-icon,.lb-redo-icon{mask-image:url("assets/icons/loadout-undo.svg?v=43215fb3ecfd")}.lb-redo-icon{transform:scaleX(-1)}.lb-copy-icon{mask-image:url("assets/icons/loadout-copy.svg?v=d89646f58fc1")}
.lb-stats-panel{padding:16px!important}.lb-stat-grid{gap:12px 10px!important}.lb-stat-label{font-size:10px!important;letter-spacing:0!important;line-height:1.3!important}.lb-stat-value{font-size:22px!important;letter-spacing:-.02em!important;line-height:1.2!important}

.lb-stats-panel{padding:27px 14px 12px!important}.lb-stats-panel.lb-stats-none{padding:0!important}.lb-metrics{gap:10px 8px!important;padding:0!important}.lb-metric{gap:1px!important}.lb-metric small{font-size:10px!important;letter-spacing:-.01em!important;line-height:1.3!important}.lb-metric strong{font-size:21px!important;letter-spacing:-.03em!important}.lb-metric>span{font-size:9px!important;line-height:1.3}.lb-stats-panel,.lb-stats-panel strong{font-family:inherit}
@media(max-width:760px){
 .lb-slots{display:flex;overflow-x:auto;gap:6px;padding-bottom:4px;scrollbar-width:thin;scroll-snap-type:x proximity}
 .lb-slot{flex:0 0 100px;padding:7px;scroll-snap-align:start}.lb-slot[aria-selected="true"]{padding-bottom:7px}.lb-slot small{font-size:10px}.lb-slot strong{font-size:12px}.lb-slot .lb-pic{height:28px}
 .lb-head{gap:5px;margin-bottom:4px}.lb-head strong{font-size:17px}.lb-head small{font-size:10px}.lb-actions{gap:5px;flex-wrap:nowrap;width:100%}.lb-actions .lb-btn{min-height:36px;padding:6px 8px;font-size:11px}.lb-actions .lb-btn-main{font-size:0;gap:0}.lb-actions .lb-btn-main .lb-action-icon{width:18px;height:18px}
 .lb-body{gap:10px}.lb-stage{min-height:208px;padding:0}.lb-live-port{height:162px}.lb-view-tools{flex-wrap:nowrap;gap:0;padding:3px}.lb-view-btn{min-width:28px;min-height:34px;padding:3px 5px;font-size:14px}.lb-angle-value,.lb-zoom-value{min-width:32px;font-size:10px}
 .lb-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.lb-item{grid-template-columns:26px minmax(0,1fr);padding:5px;gap:5px;min-height:48px;font-size:11px}.lb-item b{font-size:10px}.lb-item .lb-pic{width:26px;height:26px}.lb-item>span:not(.lb-pic):not(.lb-lock){white-space:normal;overflow-wrap:anywhere}
}

/* Only the tab touching an outer corner removes that corner's radius. */
@media(min-width:861px){
 .lb-ed{border-top-left-radius:10px;border-top-right-radius:10px}
 .lb-slots:has(.lb-slot:first-child[aria-selected="true"])+.lb-ed{border-top-left-radius:0}
 .lb-slots:has(.lb-slot:last-child[aria-selected="true"])+.lb-ed{border-top-right-radius:0}
}
.lb-head{align-items:center}.lb-head-start{display:flex;align-items:center;gap:16px;min-width:0;flex-wrap:wrap}.lb-identity{min-width:85px}.lb-share-actions{margin-left:auto}
.lb-metric>small{display:flex;align-items:center;gap:4px}.lb-metric .loadout-stat-icon{width:13px;height:13px;flex:none}
@media(max-width:760px){.lb-head{align-items:flex-end}.lb-head-start{gap:8px;width:auto;flex:1;min-width:0}.lb-build-actions{width:auto;flex-wrap:wrap}.lb-share-actions{width:auto;margin-left:auto}.lb-identity{min-width:74px}}

/* Approved stat silhouettes use the reviewed 20px size. */
.lb-metric .loadout-stat-icon-selected{width:20px;height:20px}
.lb-metrics:has(.loadout-stat-icon-selected) .lb-metric>small{min-height:26px}

/* Keep editing actions near the weapon name; sharing stays on the right. */
.lb-head{justify-content:flex-start;column-gap:8px}
.lb-head-start{gap:10px}
.lb-identity{min-width:56px}
.lb-share-actions{margin-left:auto}

/* Keep skin ownership readable while the option is locked. */
.lb-drawer .lb-opt.lb-is-locked.lb-skin-locked > span, .lb-drawer .lb-opt.lb-is-locked.lb-skin-locked > .lb-skin-requirement { visibility: visible; }
.lb-skin-requirement { display: block; color: var(--lb-accent); font-size: 10px; line-height: 1.35; margin-top: 5px; }
.lb-opt.lb-skin-locked > .lb-option-effects { display: none !important; }

.lb-opt.lb-skin-locked > .lb-lock { left: auto; right: 7px; top: 7px; transform: scale(.6); transform-origin: top right; }

/* Natural-height inner rows share the tallest card; headings stay compact. */
.lb-drawer .lb-opts{display:block;scrollbar-gutter:stable}
.lb-options-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:6px;align-items:stretch}
.lb-drawer .lb-opt{height:auto;align-self:stretch}
.lb-drawer .lb-weapon-type{grid-column:1/-1;margin:12px 0 3px;padding:0 0 7px;border:0;border-bottom:1px solid var(--lb-line);font:600 12px/1.4 var(--font-family-base,Arial,sans-serif);color:var(--lb-muted);text-align:left}
.lb-drawer .lb-weapon-type:first-child{margin-top:2px}


/* Black is the default editor surface; grey retains the existing wiki palette. */
.lb-black-background :is(.lb,.lb-drawer,.lb-tooltip){
 --lb-tile:#101010;--lb-raise:#191919;--lb-line:#303033;--lb-muted:#aaaab0;
 --color-base:#d3d3d6;--color-emphasized:#ececef;color:var(--color-base);color-scheme:dark;
}
.lb-black-background .lb-ed,.lb-black-background .lb-slot[aria-selected="true"]{background:#000}
@media(min-width:861px){.lb-black-background .lb-slot[aria-selected="true"]{border-bottom-color:#000}}
.lb-black-background :is(.lb-slot,.lb-item,.lb-opt) .lb-w{background:transparent}
.lb-black-background :is(.lb,.lb-drawer) .lb-is-locked{background:#080808!important}
.lb-black-background :is(.lb-effect-good,.lb-impact-good strong){color:#75d5a0}
.lb-black-background :is(.lb-effect-bad,.lb-impact-bad strong){color:#f09baa}
.lb .lb-background-toggle{
 width:40px;height:40px;min-height:40px;flex:0 0 40px;padding:0!important;
 border:1px solid var(--lb-accent);border-radius:12px;background:#000;
}
.lb .lb-background-toggle[aria-pressed="false"]{background:var(--lb-raise)}
.lb .lb-background-toggle:hover{border-color:var(--lb-accent);box-shadow:0 0 0 2px #ed862b24}
@media(max-width:760px){.lb .lb-background-toggle{width:36px;height:36px;min-height:36px;flex-basis:36px;border-radius:10px}}


/* A separate right rail keeps stats and the picker outside the model editor. */
html:root body.boxed-site[data-page="Loadout Builder"] .citizen-page-container{
 display:grid!important;grid-template-columns:190px minmax(0,1fr) clamp(270px,23vw,400px)!important;
 grid-template-rows:1fr auto;column-gap:24px!important;max-width:none!important;
}
html:root body.bc-tool-sidebar-compact.boxed-site[data-page="Loadout Builder"] .citizen-page-container{
 grid-template-columns:72px minmax(0,1fr) clamp(270px,23vw,400px)!important;
}
body[data-page="Loadout Builder"] .mw-body{grid-column:2;grid-row:1;min-width:0}
body[data-page="Loadout Builder"] .boxed-footer{grid-column:1/-1}
.lb-side-rail{grid-column:3;grid-row:1;position:sticky;top:12px;align-self:start;display:flex;flex-direction:column;gap:12px;min-width:0;margin:0;z-index:20}
.lb-stats-panel{width:100%;max-width:100%;padding:12px 14px!important;border-radius:12px;flex:none}
.lb-stats-panel[hidden]{display:none}
.lb-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px!important}
.lb-metric strong{font-size:20px!important;line-height:1.2!important}
.lb-metrics .lb-metric>small{min-height:18px;gap:4px}
.lb-metric .loadout-stat-icon,.lb-metric .loadout-stat-icon-selected{width:16px;height:16px}
.lb-metrics:has(.loadout-stat-icon-selected) .lb-metric>small{min-height:18px}
.lb-body,.lb-equipment .lb-body{grid-template-columns:minmax(0,1fr);grid-template-areas:"preview" "parts";grid-template-rows:auto auto}
.lb-equipment .lb-list{grid-template-columns:repeat(4,minmax(0,1fr))}
.lb-side-rail .lb-drawer.lb-drawer-expanded{
 position:relative;top:auto;bottom:auto;left:auto;width:100%;max-width:100%;margin:0;
 min-height:220px;max-height:none;flex:0 1 auto;padding:12px;gap:10px;box-shadow:0 8px 24px #0003;
}
.lb-side-rail .lb-drawer[hidden]{display:none}
.lb-side-rail .lb-drawer-heading{gap:8px;flex-wrap:nowrap}
.lb-side-rail .lb-drawer .lb-opt{padding:8px 4px;font-size:11px}
.lb-side-rail .lb-drawer .lb-opt .lb-effect{font-size:9px}
@media(max-width:1100px){
 html:root body.boxed-site[data-page="Loadout Builder"] .citizen-page-container,
 html:root body.bc-tool-sidebar-compact.boxed-site[data-page="Loadout Builder"] .citizen-page-container{
  grid-template-columns:minmax(0,1fr) 270px!important;gap:16px!important;
 }
 body[data-page="Loadout Builder"] .boxed-sidebar,body[data-page="Loadout Builder"] .bc-sidebar-toggle{display:none!important}
 body[data-page="Loadout Builder"] .mw-body{grid-column:1}
 .lb-side-rail{grid-column:2}
}
@media(max-width:760px){
 html:root body.boxed-site[data-page="Loadout Builder"] .citizen-page-container,
 html:root body.bc-tool-sidebar-compact.boxed-site[data-page="Loadout Builder"] .citizen-page-container{display:flex!important;flex-direction:column}
 .lb-side-rail{position:static;width:100%;order:0}
 .lb-side-rail:has(.lb-drawer:not([hidden])){position:fixed;inset:12px 12px auto;width:auto;z-index:9000}
 body[data-page="Loadout Builder"] .mw-body{order:1}
 body[data-page="Loadout Builder"] .boxed-footer{order:2}
 .lb-side-rail .lb-drawer.lb-drawer-expanded{height:55dvh!important;min-height:220px}
 .lb-equipment .lb-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Move the rail across the unused contents-column space without resizing it. */
.lb-side-rail{transform:translateX(var(--lb-rail-shift,0px))}

/* Explain each compatibility lock beside its icon, including skin restrictions. */
.lb-is-locked > .lb-lock-note{visibility:visible;display:flex!important;align-items:center;justify-content:center;gap:5px;min-width:0;white-space:normal;overflow:visible;color:var(--color-base,#c6c6c6)}
.lb-lock-note .lb-lock{position:relative;left:auto;top:auto;transform:scale(.64);flex:0 0 24px;margin:-4px;visibility:visible}
.lb-lock-note small{display:block;font:400 10px/1.25 var(--font-family-base,Arial,sans-serif);white-space:normal;overflow-wrap:anywhere;text-align:left;min-width:0}
.lb-item.lb-is-locked{grid-template-columns:24px minmax(0,1fr);gap:6px}
.lb-item.lb-is-locked > span:not(.lb-pic):not(.lb-lock-note){display:none}
.lb-item.lb-is-locked .lb-pic{width:24px}
.lb-item .lb-lock-note{justify-content:flex-start}
.lb-category-option.lb-is-locked{display:flex;align-items:center;justify-content:center;padding:6px}
.lb-category-option.lb-is-locked > span:not(.lb-lock-note){display:none}
.lb-category-option .lb-lock-note .lb-lock{transform:scale(.6)}
.lb-opt.lb-is-locked > span:not(.lb-option-effects){visibility:visible}
.lb-opt.lb-is-locked > .lb-option-effects{display:none!important}
.lb-opt .lb-lock-note{margin-top:4px;max-width:100%;flex-shrink:0}
.lb-opt .lb-lock-note small{font-size:10px;line-height:1.3}

.lb-item .lb-lock-note small{font-size:11px;line-height:1.2}

.lb-item.lb-is-locked{padding-top:6px;padding-bottom:6px}