/* 문서 선택과 같은 문서의 보기 전환을 구분한다. 기존 화면의 글자/색 토큰을 사용한다. */
#view-estimate #estModeBar.est-workspace {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 16px !important;
  padding: 20px !important;
  margin-bottom: 16px;
  border: 1px solid var(--doc-border);
  border-radius: 16px;
  background: linear-gradient(135deg, #f8faff, #fff 65%);
  box-shadow: var(--shadow-sm);
  color: var(--text-main);
  min-width: 0;
}
.est-workspace-document { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.est-workspace-document-title { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.est-workspace-document-title strong { font-size: var(--fs-title); overflow-wrap: anywhere; }
.est-workspace-label { font-size: var(--fs-meta); color: var(--accent); font-weight: 700; }
.est-workspace-views { border-top: 1px solid var(--doc-border); padding-top: 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.est-workspace-view-heading { display: flex; align-items: baseline; margin: 0; }
.est-workspace-view-heading strong { font-size: var(--fs-base); }
.est-workspace-note { color: var(--text-sub); font-size: var(--fs-base); line-height: 1.6; margin: 8px 0 0; }
#view-estimate #estModeBar.est-workspace #estModeHint { display: block !important; }
.est-workspace-mode-buttons { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; flex: 1; min-width: 260px; padding: 4px; border-radius: 12px; background: #eef2f8; }
.est-workspace-help { flex-shrink: 0; }
.est-workspace-help[open] { flex-basis: 100%; }
.est-workspace-help summary,
.est-workspace-templates summary { width: fit-content; min-height: 44px; padding: 10px 12px; border-radius: 8px; cursor: pointer; font-size: var(--fs-base); color: var(--text-sub); font-weight: 600; }
.est-workspace-help summary:hover,
.est-workspace-templates summary:hover { color: var(--accent); background: #eff6ff; }
.est-workspace-help summary:focus-visible,
.est-workspace-templates summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
#view-estimate #estModeBar.est-workspace button {
  min-height: 44px;
  min-width: 44px;
  font-size: var(--fs-base) !important;
  padding: 8px 10px !important;
  line-height: 1.4;
  cursor: pointer;
  touch-action: manipulation;
  white-space: normal;
}
#view-estimate #estModeBar.est-workspace .est-mode-btn {
  border: 1px solid transparent;
  border-radius: 8px;
  font-weight: 700;
}
#view-estimate #estModeBar.est-workspace .est-mode-btn[aria-pressed="true"] { background: var(--accent) !important; color: var(--card-bg) !important; border-color: var(--accent); box-shadow: 0 2px 6px #2563eb26; }
#view-estimate #estModeBar.est-workspace .est-mode-btn[aria-pressed="false"] { background: transparent !important; color: var(--text-sub) !important; }
#view-estimate #estModeBar.est-workspace .est-mode-btn[aria-pressed="false"]:hover { background: var(--card-bg) !important; color: var(--accent) !important; }
.est-workspace-link { border: 1px solid var(--doc-border); border-radius: 8px; background: var(--card-bg); color: var(--accent); font-weight: 600; }
.est-workspace-link:hover { background: var(--bg-main); }
.est-workspace-status { display: grid; gap: 6px; }
.est-workspace-status:empty { display: none; }
.est-workspace-state { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; border-left: 3px solid #bfdbfe; border-radius: 4px 10px 10px 4px; background: #eff6ff; }
.est-workspace-state > div { min-width: 0; overflow-wrap: anywhere; }
.est-workspace-state strong { font-size: var(--fs-base); color: #1e40af; }
.est-workspace-state p { color: var(--text-sub); font-size: var(--fs-meta); line-height: 1.6; margin: 4px 0 0; }
.est-workspace-state button { flex-shrink: 0; }
#view-estimate #estModeBar.est-workspace .est-workspace-templates { display: block; border-top: 1px solid var(--doc-border); }
.est-workspace-templates[open] button { margin: 0 8px 8px 0; }
@media (min-width: 901px) {
  #view-estimate #estModeBar.est-workspace { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .est-workspace-document, .est-workspace-views { grid-column: 1 / -1; }
  .est-workspace-state > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
  .est-workspace-state p { margin: 0; }
  #view-estimate #estModeBar.est-workspace .est-workspace-templates { border-top: 0; }
}
#view-estimate #estModeBar.est-workspace #estTplSaveBtn::before,
#view-estimate #estModeBar.est-workspace #estTplLoadBtn::before { content: none; }
#estListView .est-document-heading { flex-wrap: wrap; gap: 12px; }
#estListView .est-document-heading h3 { font-size: var(--fs-title) !important; margin: 0; }
#estListView .est-document-heading > div { flex-wrap: wrap; gap: 8px !important; }
#estListView .est-document-note { font-size: var(--fs-base); color: var(--text-sub); line-height: 1.6; margin: 0 0 16px; }
#estListView .est-document-row { flex-wrap: wrap; gap: 8px !important; }
#estListView .est-document-open { border: 0; background: transparent; color: inherit; text-align: left; font: inherit; padding: 4px; }
#estListView .est-document-open > span { display: block; white-space: normal !important; overflow-wrap: anywhere; }
#estListView .est-document-open > span:first-child { font-size: var(--fs-base) !important; }
#estListView .est-document-open > span:last-child { font-size: var(--fs-meta) !important; line-height: 1.5; }
#estListView .est-document-heading button,
#estListView .est-document-row button { min-height: 44px; min-width: 44px; font-size: var(--fs-base) !important; cursor: pointer; touch-action: manipulation; }
#view-estimate #estModeBar.est-workspace button:focus-visible,
#estListView .est-document-heading button:focus-visible,
#estListView .est-document-row button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
#estListView .est-document-row button:disabled { cursor: default; }
@media (max-width: 768px) {
  #view-estimate #estModeBar.est-workspace { padding: 16px !important; }
  #view-estimate #estModeBar.est-workspace .est-workspace-state { flex-direction: column; align-items: stretch; }
  #view-estimate #estModeBar.est-workspace .est-workspace-document { flex-wrap: wrap; }
  #view-estimate #estModeBar.est-workspace .est-workspace-mode-buttons { flex-basis: 100%; min-width: 0; }
  #estListView .est-document-heading { flex-direction: column; align-items: stretch !important; }
  #estListView .est-document-open { flex-basis: calc(100% - 42px) !important; }
}

/* ── 📐 2026-10-12 상단 압축 · 보기별 정리 ──────────────────────────────
   표가 화면 아래로 밀리던 것(PC 표 머리 y≈700): 문서 바를 두 줄 도구막대로 접는다.
   1줄 = 현재 문서·문서 선택 | 보기 이름·세 보기, 2줄 = 문서 상태 | 보기 안내·문서 양식.
   ★DOM·id·버튼 공통 부모는 그대로(.est-workspace-views 는 display:contents 로 칸만 풀어 준다). */
@media (min-width: 1024px) {
  #view-estimate #estModeBar.est-workspace {
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas: "doc label modes" "status help tools";
    align-items: center;
    gap: 10px 16px !important;
    padding: 14px 20px !important;
  }
  #view-estimate #estModeBar.est-workspace .est-workspace-views { display: contents; }
  #view-estimate #estModeBar.est-workspace .est-workspace-document { grid-area: doc; justify-content: flex-start; }
  #view-estimate #estModeBar.est-workspace .est-workspace-view-heading { grid-area: label; justify-self: end; }
  #view-estimate #estModeBar.est-workspace .est-workspace-mode-buttons { grid-area: modes; width: 360px; min-width: 0; }
  #view-estimate #estModeBar.est-workspace .est-workspace-status { grid-area: status; display: flex; flex-wrap: wrap; gap: 8px; }
  #view-estimate #estModeBar.est-workspace .est-workspace-status:empty { display: none; }
  #view-estimate #estModeBar.est-workspace .est-workspace-help { grid-area: help; justify-self: end; }
  #view-estimate #estModeBar.est-workspace .est-workspace-templates { grid-area: tools; justify-self: end; }
  /* 펼친 안내·양식은 아래 줄 전체 폭으로 — 좁은 칸에서 펼치면 첫 줄 폭이 출렁인다 */
  #view-estimate #estModeBar.est-workspace .est-workspace-help[open] { grid-area: auto; grid-row: 3; grid-column: 1 / -1; justify-self: stretch; }
  #view-estimate #estModeBar.est-workspace .est-workspace-templates[open] { grid-area: auto; grid-row: 4; grid-column: 1 / -1; justify-self: stretch; }
  #view-estimate #estModeBar.est-workspace .est-workspace-state { padding: 8px 12px; }
}
@media (max-width: 768px) {
  /* 폰: 이름표 «이 문서의 보기»는 화면에서만 감추고(세 버튼 묶음의 aria 이름이라 지우지 않는다) 안내·양식을 한 줄에 */
  #view-estimate #estModeBar.est-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas: "doc doc" "modes modes" "status status" "help tools";
    gap: 10px !important;
    padding: 14px !important;
  }
  #view-estimate #estModeBar.est-workspace .est-workspace-views { display: contents; }
  #view-estimate #estModeBar.est-workspace .est-workspace-document { grid-area: doc; }
  #view-estimate #estModeBar.est-workspace .est-workspace-mode-buttons { grid-area: modes; }
  #view-estimate #estModeBar.est-workspace .est-workspace-status { grid-area: status; }
  #view-estimate #estModeBar.est-workspace .est-workspace-status:empty { display: none; }
  #view-estimate #estModeBar.est-workspace .est-workspace-help { grid-area: help; }
  #view-estimate #estModeBar.est-workspace .est-workspace-templates { grid-area: tools; border-top: 0; justify-self: end; }
  #view-estimate #estModeBar.est-workspace .est-workspace-help[open] { grid-area: auto; grid-row: 5; grid-column: 1 / -1; }
  #view-estimate #estModeBar.est-workspace .est-workspace-templates[open] { grid-area: auto; grid-row: 6; grid-column: 1 / -1; justify-self: stretch; }
  #view-estimate #estModeBar.est-workspace .est-workspace-view-heading {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
  }
}

/* 보기마다 쓰지 않는 조작은 감춘다 — 값·입력 노드는 지우지 않는다(원가계획으로 돌아오면 그대로) */
/* 관리비·이윤 상자: 안쪽 입력만 숨겨 흰 껍데기가 남던 것 */
body.est-mode-internal #view-estimate .est-rate-card,
body.est-mode-naesu #view-estimate .est-rate-card { display: none; }
/* «비율(%)»은 원가계획 요약 바의 비율 줄을 켜는 스위치 — 요약 바가 없는 두 보기에선 눌러도 아무 일이 없다 */
body.est-mode-internal #view-estimate label:has(> #estShowPct),
body.est-mode-naesu #view-estimate label:has(> #estShowPct) { display: none; }
/* 내수표: 위 담당자·작성일 줄은 저장이 «문서 머리» 쪽 한 길이라(saveEstTabMeta 가 내수표에선 안 받는다)
   보이면 고쳐도 사라지는 칸이 된다 — 같은 값은 아래 «문서 머리»에서 고친다 */
body.est-mode-naesu #view-estimate #estTabInfo { display: none; }

/* ── 💵 발주·지급 정산 (estimate-internal.js _buildInternalFooter) ── */
#view-estimate #estInternalFooter.est-int-card {
  margin-bottom: 24px;
  border: 1px solid var(--doc-border);
  border-radius: 16px;
  background: var(--card-bg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
#estInternalFooter .est-int-row-hidden { display: none !important; }
.est-int-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; padding: 10px 20px; background: #1e293b; color: #fff; }
.est-int-head strong { font-size: var(--fs-base); font-weight: 800; }
.est-int-head span { font-size: var(--fs-meta); color: #cbd5e1; }
/* 칸 수는 카드 폭으로 정한다(사이드바를 펼치면 같은 창에서도 좁아진다): 넓으면 4칸, 좁으면 2칸.
   flex 라 숨은 칸(계약금액·부가세 …)이 있으면 남은 칸이 폭을 나눠 가진다 — 격자처럼 빈 자리가 남지 않는다 */
#estInternalFooter { container-type: inline-size; }
.est-int-grid { display: flex; flex-wrap: wrap; gap: 12px; padding: 16px 20px 0; }
.est-int-grid > .est-int-cell { flex: 1 1 calc(50% - 12px); }
@container (min-width: 820px) { .est-int-grid > .est-int-cell { flex-basis: calc(25% - 12px); } }
.est-int-cell { display: flex; flex-direction: column; justify-content: space-between; gap: 6px; min-width: 0; padding: 12px 14px; border-radius: 12px; border: 1px solid #eef2f7; background: #f8fafc; }
.est-int-label { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 6px; font-size: var(--fs-base); font-weight: 700; color: #334155; line-height: 1.4; }
.est-int-note { font-size: var(--fs-badge); font-weight: 600; color: #94a3b8; }
.est-int-value { font-size: clamp(16px, 0.8rem + 0.8vw, 22px); font-weight: 800; color: #1e293b; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.est-int-secondary .est-int-value { font-size: var(--fs-title); }
.est-int-input { width: 100%; min-height: 36px; padding: 2px 0; border: 0; border-bottom: 2px solid #fcd34d; background: transparent; outline: none; text-align: right; font-size: clamp(16px, 0.8rem + 0.8vw, 22px); font-weight: 800; color: #78350f; font-variant-numeric: tabular-nums; }
.est-int-input:focus-visible { border-bottom-color: #d97706; }
.est-int-blue { background: #eff6ff; border-color: #dbeafe; } .est-int-blue .est-int-label { color: #1e40af; } .est-int-blue .est-int-value { color: #1d4ed8; }
.est-int-amber { background: #fffbeb; border-color: #fde68a; } .est-int-amber .est-int-label { color: #92400e; } .est-int-amber .est-int-value { color: #b45309; }
.est-int-green { background: #ecfdf5; border-color: #a7f3d0; } .est-int-green .est-int-label { color: #065f46; } .est-int-green .est-int-value { color: #047857; }
.est-int-indigo { background: #eef2ff; border-color: #e0e7ff; } .est-int-indigo .est-int-label { color: #3730a3; } .est-int-indigo .est-int-value { color: #4338ca; }
.est-int-rose { background: #fff1f2; border-color: #ffe4e6; } .est-int-rose .est-int-label { color: #9f1239; } .est-int-rose .est-int-value { color: #be123c; }
.est-int-rate { display: grid; grid-template-columns: auto minmax(120px, 1fr) auto; align-items: center; gap: 8px 16px; margin: 12px 20px 16px; padding: 12px 14px; border-radius: 12px; border: 1px solid #eef2f7; background: #f8fafc; }
.est-int-bar { position: relative; height: 10px; border-radius: 999px; background: #e2e8f0; overflow: hidden; }
.est-int-bar-fill { position: absolute; left: 0; top: 0; bottom: 0; background: #10b981; transition: width .2s; }
.est-int-rate-text { font-size: var(--fs-title); font-weight: 800; color: #1e293b; white-space: nowrap; text-align: right; }
.est-int-rate-text.est-int-pending { color: #b45309; }
.est-int-paid-detail { grid-column: 1 / -1; font-size: var(--fs-meta); color: #64748b; line-height: 1.5; }
@media (max-width: 768px) {
  .est-int-head { padding: 10px 14px; }
  .est-int-grid { gap: 8px; padding: 12px 12px 0; }
  .est-int-cell { padding: 10px 12px; }
  .est-int-rate { grid-template-columns: auto minmax(0, 1fr); margin: 10px 12px 12px; }
  .est-int-rate-text { grid-column: 1 / -1; text-align: left; white-space: normal; }
}

/* ── 📱 폰 원가계획 요약 바: 6칸 한 줄 → 3·2·1 격자(금액이 «30,500,…»으로 잘리던 것) ──
   id·.doc-table-wrap 조상은 그대로(두 보기가 이 래퍼를 기준으로 끼워 넣고 숨긴다). 라벨은 칸의 data-label. */
@media (max-width: 768px) {
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full { display: block !important; }
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full colgroup,
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full thead { display: none !important; }
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full tbody { display: block !important; }
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full tr:not(.hidden) { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); }
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full td {
    display: flex !important; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    grid-column: span 2; padding: 8px 4px !important; white-space: normal; overflow: visible; text-overflow: clip;
    font-size: var(--fs-base) !important; font-variant-numeric: tabular-nums;
  }
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full td:nth-child(4),
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full td:nth-child(5) { grid-column: span 3; }
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full td:nth-child(6) { grid-column: 1 / -1; border-top: 1px solid #e2e8f0; }
  #view-estimate .doc-table-wrap:has(#summaryLabor) table.w-full td::before {
    content: attr(data-label); font-size: var(--fs-badge); font-weight: 700; color: #64748b;
  }
  #view-estimate #summarySupply { font-size: 20px !important; }
}

/* 발주·지급 표 머리(_syncTableHead) — 좁은 «지급» 칸이 «지|급»으로 꺾이고, 폰에선 «수주·발주…»로 잘리던 것 */
body.est-mode-internal #estimateTable thead th.c-del { white-space: nowrap; padding-left: 2px; padding-right: 2px; }
/* 좁은 머리글 «No»·«일/회차»·«단위»가 좌우 여백 8px 때문에 두 줄로 꺾이던 것(2026-10-21) — 산출·견적 표 공통 */
#estimateTable thead th.c-no, #estimateTable thead th.c-days, #estimateTable thead th.c-unit, #estimateTable thead th.c-unit2,
.quote-table thead th.c-qty, .quote-table thead th.c-days, .quote-table thead th.c-unit, .quote-table thead th.c-unit2 { padding-left: 2px; padding-right: 2px; }
/* 태블릿 폭(769~900)에선 산출 표가 약 750px 에 14칸이라 «No»·«구분(비목)»·«등급/규격»·«수량»이 꺾였다 — 머리글만 한 단계 작게 */
@media (min-width: 769px) and (max-width: 900px) {
  #estimateTable thead th, .quote-table thead th { font-size: var(--fs-meta); padding-left: 3px; padding-right: 3px; }
}
@media (max-width: 768px) {
  body.est-mode-internal #estimateTable thead th.c-price,
  body.est-mode-internal #estimateTable thead th.c-amt { white-space: normal; text-overflow: clip; line-height: 1.25; }
}

/* 내수표 지급액 칸: 거절된 입력(저장 안 됨)은 칸에 그대로 두고 빨갛게 — estimate-naesu.js cellInput */
#view-estimate input.nae-invalid { outline: 2px solid #dc2626; outline-offset: -2px; background: #fef2f2 !important; }

/* 내수표 지급액 칸의 «단위 확인» 단추 — 기본 단추 글자로 튀던 것 */
#view-estimate .nae-unit-btn {
  display: inline-flex; align-items: center; margin-top: 4px; min-height: 28px; padding: 2px 10px;
  border: 1px solid #fcd34d; border-radius: 999px; background: #fffbeb; color: #92400e;
  font-size: var(--fs-badge); font-weight: 700; white-space: nowrap; cursor: pointer;
}
#view-estimate .nae-unit-btn:hover { background: #fef3c7; }
#view-estimate .nae-unit-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  #view-estimate #estModeBar.est-workspace .est-mode-btn,
  #estListView .est-document-row { transition: none !important; }
}
@media print { #view-estimate #estModeBar.est-workspace { display: none !important; } }

/* 견적·산출 버전 목록: 폭 기준은 각 목록의 렌더 시점 offsetWidth다. */
.version-list-row { display:grid; grid-template-columns:22px minmax(0,1fr) auto 44px; align-items:center; gap:2px 8px; padding:4px 10px; border-bottom:1px solid #f1f5f9; }
.version-list-number { color:#94a3b8; font-size:var(--fs-badge); font-weight:800; text-align:right; }
.version-list-name { min-width:0; padding:0; border:0; background:transparent; text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#1e293b; font-size:var(--fs-base); font-weight:600; cursor:pointer; }
.version-list-name[aria-current] { color:#1d4ed8; font-weight:800; }
.version-list-meta { grid-row:2; grid-column:1/-1; display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; min-width:0; color:#64748b; font-size:var(--fs-meta); padding-bottom:4px; }
.version-list-date, .version-list-count, .version-list-amount { white-space:nowrap; }
.version-list-details { flex-basis:100%; overflow-wrap:anywhere; }
.version-list-count, .version-list-amount { text-align:right; font-variant-numeric:tabular-nums; }
.version-list-amount { margin-left:auto; color:#334155; font-weight:700; }
.version-list-difference { margin-left:6px; color:#64748b; font-size:var(--fs-badge); font-weight:400; }
.version-list-chips { display:flex; gap:4px; align-items:center; }
.version-list-chip { border-radius:7px; padding:2px 6px; font-size:var(--fs-badge); font-weight:700; white-space:nowrap; }
.version-status-pending_pm { background:#fef3c7; color:#92400e; }
.version-status-pending_admin, .version-status-pending { background:#dbeafe; color:#1e40af; }
.version-status-superseded { background:#e2e8f0; color:#475569; }
.version-status-approved { background:#dcfce7; color:#166534; }
.version-status-rejected { background:#fee2e2; color:#991b1b; }
.version-list-latest { background:#eef2ff; color:#4338ca; }
.version-list-more { width:44px; min-height:44px; border:0; border-radius:8px; background:transparent; color:#64748b; font-size:var(--fs-title); font-weight:800; cursor:pointer; }
.version-list-more:hover, .version-list-more[aria-expanded="true"] { background:#eef2ff; color:#4338ca; }
.version-list-row button:focus-visible, .version-list-menu-item:focus-visible { outline:2px solid #2563eb; outline-offset:-2px; }
.version-list-wide { display:grid; grid-template-columns:32px minmax(0,1fr) 82px 36px max-content max-content 54px; column-gap:8px; }
.version-list-wide .version-list-row { grid-column:1/-1; grid-template-columns:subgrid; min-height:52px; }
.version-list-wide .version-list-meta { display:contents; }
.version-list-wide .version-list-details { grid-row:2; grid-column:2/-1; padding-bottom:4px; }
.version-list-wide .version-list-amount { margin:0; }
.version-list-difference:empty { display:none; }
.version-list-wide .version-list-difference { display:inline-block; min-width:7.5em; text-align:right; }
.version-list-wide .version-list-chips { justify-content:flex-end; }
/* 기존 산출 카드의 버튼 줄바꿈 규칙보다 구체적으로 한 줄 격자를 유지한다. */
#estListView .est-document-row.version-list-row { gap:2px 8px !important; }
#estListView .version-list-row .version-list-name { min-width:0; min-height:44px; }
.version-list-menu { position:fixed; z-index:10000; min-width:164px; max-width:calc(100vw - 16px); max-height:calc(100vh - 16px); overflow:auto; padding:4px; border:1px solid #e2e8f0; border-radius:12px; background:#fff; box-shadow:0 8px 24px #0f172a26; }
.version-list-menu[hidden] { display:none; }
.version-list-menu-item { display:block; width:100%; min-height:44px; padding:8px 12px; border:0; border-radius:8px; background:transparent; text-align:left; color:#334155; font-size:var(--fs-base); cursor:pointer; }
.version-list-menu-item:hover { background:#eff6ff; color:#1d4ed8; }
.version-list-menu-item:disabled { opacity:.6; cursor:default; }
.version-list-menu-note { display:block; padding:6px 12px; color:#64748b; font-size:var(--fs-meta); overflow-wrap:anywhere; }