/* ===========================================================================
   보부상 게임 — 아침 도매상 화면 (DD 구조 · 확정본)
   2026-08-13 · 기준 문서 pm/DECISIONS_2026-08-13.md · 시안 graphics/shop_dd.css + _sA.html

   시안(shop_dd.css)은 1280×720 고정 무대에 body/.stage 를 직접 쓰는 독립 페이지였다.
   이 파일은 그걸 게임 무대(.bs-screen)에 얹을 수 있게 옮긴 것이다.

     · 모든 선택자를 .bs-screen.bs-shop 아래로 한정했다 — 다른 화면에 새지 않는다
     · 팔레트 변수·픽셀 규칙은 bobusang-ui.css 가 이미 정의한다. 여기서 다시 만들지 않는다
     · 크기는 전부 cqw(무대 폭 기준)라 창이 커져도 비율이 유지된다
     · 시안의 B(밝은 장터)·C(좌판 정면) 안은 뺐다 — 기획 A-4 에서 A(어두운 실내) 확정

   ⚠️ index.html 링크 순서에서 bobusang-screens.css **뒤**에 와야 한다.
      도매 화면의 .bs-shop-list / .bs-bagbox 위치를 여기서 덮어쓰기 때문이다.
   =========================================================================== */

/* ── 무대 · 배경 ────────────────────────────────────────────────────────────
   가게 안이라 어둡다. 하루가 「어두운 가게 → 밝은 장터 → 밤」으로 흐른다(기획 A-4).
   배경이 어두운 1~4단계를 가져갔으므로, 판은 명도가 아니라 **밝은 테두리**로 띄운다.
   ⚠️ 그래서 이 화면에는 .bs-veil 을 깔지 마라. 이미 어둡다 — 더 덮으면 형태가 죽는다. */
.bs-screen.bs-shop .bs-bg{ object-position:center 60%; }

/* ── ① 상인 ── 화면 왼쪽을 사람이 차지한다 ─────────────────────────────────
   ⚠️ 캐릭터에는 명도 압축을 걸지 마라(STYLE_SPEC 3절). 손님 초상과 같은 규격이다. */
.bs-screen.bs-shop .bs-keeper-wrap{
  position:absolute; left:0; bottom:0; height:84%; width:auto; z-index:2;
}
.bs-screen.bs-shop .bs-keeper-idle,
.bs-screen.bs-shop .bs-keeper-fx{ position:relative; height:100%; width:max-content; transform-origin:50% 100%; }
.bs-screen.bs-shop .bs-keeper{
  position:static; left:auto; bottom:auto; height:100%; width:auto; display:block;
}

/* 상인 대사 — 기획 A-1 (b) 정해진 한 줄. AI 호출 없음.
   자리: 상인 몸통 위, 소문 띠 위. 얼굴(위쪽)과 소문(아래쪽)을 둘 다 피한 유일한 빈 칸이다.
   ⚠️ 대사가 없을 때는 JSX 에서 통째로 렌더하지 마라. 빈 판이 남으면 여백이 아니라 버그로 보인다. */
/* ⚠️ bottom 을 단순 % 로 두지 마라. 창이 작아지면 아래 소문 띠(.bs-footbar)가
   clamp 하한 때문에 상대적으로 두꺼워져(무대 403px 에서 높이 69px = 17%)
   말풍선을 덮는다 — 실측으로 29px 겹쳤다.
   px 하한을 함께 걸어야 작은 창에서도 소문 띠 위에 남는다. */
.bs-screen.bs-shop .bs-keepsay{
  position:absolute; left:2.2%; width:34%; bottom:clamp(90px,13.5%,120px); z-index:5;
  background:var(--c1); border:2px solid var(--c5); box-shadow:4px 4px 0 var(--c1);
  color:var(--c8); font-size:clamp(9px,1.35cqw,15px); line-height:1.5;
  padding:clamp(7px,1.2cqw,13px) clamp(9px,1.5cqw,17px) clamp(6px,1cqw,11px);
}
/* 이름표 — 협상 화면의 .bs-vntab 과 같은 패턴으로 판 왼쪽 위 모서리에 걸친다.
   기획 B-4: 직함은 작게, 이름만 크게. */
.bs-screen.bs-shop .bs-keeptab{
  position:absolute; left:-2px; top:calc(-1 * clamp(13px,2.1cqw,19px));
  background:var(--c5); color:var(--c1); border:2px solid var(--c1);
  font-weight:700; white-space:nowrap;
  padding:1px clamp(9px,1.5cqw,16px); font-size:clamp(9px,1.4cqw,16px);
}
.bs-screen.bs-shop .bs-keeptab .ttl{
  font-size:.72em; font-weight:700; opacity:.8; margin-right:.35em;
}

/* ── 판 ── DD 는 칸의 밝은 테두리로 판을 띄운다 ────────────────────────────
   ⚠️ 판 높이를 고정하지 마라. 속이 빈 판은 여백이 아니라 버그로 읽힌다. */
.bs-screen.bs-shop .bs-shop-list,
.bs-screen.bs-shop .bs-bagbox{
  left:38%; right:2.2%; width:auto;
  background:rgba(9,14,7,.94); border:2px solid var(--c5); box-shadow:4px 4px 0 rgba(0,0,0,.55);
}
.bs-screen.bs-shop .bs-shop-list{ top:12%; }
.bs-screen.bs-shop .bs-bagbox  { top:44%; }
/* 봇짐 판 머리 한 줄 — 「더 큰 봇짐은 그록나르에서 판다」 [2026-08-23 · 지시문_봇짐레벨링 【4-2】].
   ⚠️ 이 안내를 도매 격자의 회색 칸으로 옮기지 마라 — 격자가 7칸이 되면 칸 폭 95.5px 에
      아이콘 96px 라 판을 뚫는다(아래 §② 경고와 같은 사고) */
.bs-screen.bs-shop .bs-bagaway{
  /* ⚠️ 위 여백을 줄이지 마라 — 판 제목 카투슈(.bs-cart)가 판 위 모서리에 **겹쳐** 앉아 있어서
     첫 줄을 판 꼭대기에 붙이면 「봇짐」 명패 밑으로 깔려 문장이 잘린다(실측 2026-08-23).
     원래 그 자리를 벌려 주던 것은 아래 .bs-bag 의 padding-top 이다 — 그래서 그 몫을
     이 줄이 물려받고, 격자 쪽은 다음 규칙에서 줄인다 */
  margin:clamp(14px,2cqw,26px) clamp(8px,1.1cqw,14px) 0;
  padding-left:7px; border-left:3px solid var(--gold);
  color:var(--c4); font-size:clamp(8px,1cqw,12px); line-height:1.4;
}
.bs-screen.bs-shop .bs-bagaway + .bs-bag{ padding-top:clamp(6px,.9cqw,11px); }
.bs-screen.bs-shop .bs-bagaway b{ color:var(--gold) }

/* 제목 카투슈 — 배지 + 제목이 판 위쪽 모서리에 걸친다
   ⚠️ 카투슈는 판 밖으로 나와 배경 위에 뜬다. 맨 글자로 두면 배경 명도에 따라 사라진다 —
      반드시 자기 판을 깔아 준다 */
.bs-screen.bs-shop .bs-cart{
  position:absolute; top:calc(-1 * clamp(13px,2.1cqw,19px)); left:1cqw; right:1cqw;
  display:flex; align-items:center; gap:clamp(5px,.8cqw,9px);
}
.bs-screen.bs-shop .bs-cart .badge{
  width:clamp(20px,2.6cqw,30px); height:clamp(20px,2.6cqw,30px); flex:none;
  background:var(--c1); border:2px solid var(--c5);
  display:flex; align-items:center; justify-content:center;
}
/* 16px 고정 [2026-08-17 · GFX_BUGS #4] — coin16 은 16칸 격자라 16/32/64 정수배만 허용.
   75%(≈20px 비정수)로 두면 pixelated 최근접 축소가 격자를 깨뜨린다 */
.bs-screen.bs-shop .bs-cart .badge img{ width:16px; height:16px; display:block; }
.bs-screen.bs-shop .bs-cart .ct{
  background:var(--c5); color:var(--c1); border:2px solid var(--c1);
  font-weight:700; letter-spacing:.02em; white-space:nowrap;
  padding:1px clamp(8px,1.2cqw,14px); font-size:clamp(9px,1.45cqw,16px);
}
.bs-screen.bs-shop .bs-cart .cs{
  background:var(--c1); border:2px solid var(--c3); color:var(--c5);
  font-weight:700; letter-spacing:.12em; white-space:nowrap;
  padding:1px clamp(6px,.9cqw,10px); font-size:clamp(7.5px,1.1cqw,12px);
}
.bs-screen.bs-shop .bs-cart .cnt{
  margin-left:auto; background:var(--c1); border:2px solid var(--c3); color:var(--c6);
  font-weight:700; white-space:nowrap;
  padding:1px clamp(7px,1cqw,11px); font-size:clamp(8px,1.15cqw,13px);
}

/* ── ② 물건 = 슬롯 격자 ────────────────────────────────────────────────────
   기획 A-3 확정: 도매 풀이 인간 5종·오크 4종뿐이라 **한 줄 5칸이면 충분하다.**
   2줄째를 만들면 채울 물건이 없어 빈 칸만 남는다.

   ⚠️ repeat(5,1fr) 로 쓰지 마라. 1fr 은 minmax(auto,1fr) 이라 칸 내용(아이콘+이름)이
      트랙을 밀어내 판 밖으로 넘친다 — 봇짐에서 실제로 43px 넘쳤던 사고와 같은 원인이다.

   ⚠️ 칸 수는 --cols 로 받는다. 5 고정으로 두면 **오크 마을에서 오른쪽 한 칸이 빈다** —
      도매 풀이 인간 5종·오크 4종이기 때문이다(기획 A-3). JSX 에서 진열 개수를 넘겨라:
        <div className="bs-grid" style={{ "--cols": stock.length }}>
      안 넘기면 5로 동작하니 깨지지는 않는다. */
.bs-screen.bs-shop .bs-grid{
  display:grid; grid-template-columns:repeat(var(--cols,5),minmax(0,1fr));
  gap:clamp(5px,.85cqw,11px);
  padding:clamp(14px,2cqw,26px) clamp(8px,1.1cqw,14px) clamp(8px,1.1cqw,14px);
}
.bs-screen.bs-shop .bs-slot{ min-width:0; cursor:pointer; }
/* ⚠️ 칸 높이는 **고정**이다. aspect-ratio:1 로 두지 마라 —
   칸 수가 줄면(오크 4종) 칸이 넓어지고, 정사각이라 높이까지 같이 커져서
   판 전체가 아래로 늘어나 **봇짐 판이 아이템 이름을 덮는다**(실측: 오크 마을에서 발생).
   10.78cqw = 1280 무대에서 138px = 5칸일 때의 칸 폭. 그래서 5칸에선 정사각이고,
   4칸에선 가로로 조금 긴 칸이 되면서 판 높이는 그대로 유지된다. */
.bs-screen.bs-shop .bs-slot .box{
  position:relative; width:100%; height:clamp(56px,10.78cqw,138px);
  background:#0d1408; border:2px solid var(--c4);
  display:flex; align-items:center; justify-content:center;
}
.bs-screen.bs-shop .bs-slot:hover .box{ border-color:var(--c6); }
/* 아이콘은 128px 안에 32칸이다 — 32의 정수배가 아니면 칸이 깨진다.
   1280 무대에서 정확히 96px(=32×3)이 되게 잡았다. 무대가 작아지면 함께 줄어든다 */
.bs-screen.bs-shop .bs-slot .box img{
  width:clamp(32px,7.5cqw,96px); height:clamp(32px,7.5cqw,96px); display:block;
}
.bs-screen.bs-shop .bs-slot .pr{
  position:absolute; left:0; right:0; bottom:0; text-align:center;
  background:var(--c1); color:var(--gold); border-top:2px solid var(--c4);
  font-weight:700; font-size:clamp(9px,1.2cqw,15px); padding:1px 0;
}
.bs-screen.bs-shop .bs-slot .nm{
  display:block; text-align:center; color:var(--c6);
  font-size:clamp(7px,.95cqw,12px); margin-top:clamp(2px,.4cqw,5px);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* 칸 부제 — 봇짐 매물의 「6칸」 [2026-08-23 · 지시문_봇짐레벨링 【5-2】].
   이게 없으면 그 칸의 **값어치가 화면에 없다**(같은 그림·다른 값의 칸이 세 번 걸린다) */
.bs-screen.bs-shop .bs-slot .sub{
  display:block; text-align:center; color:var(--c4);
  font-size:clamp(6.5px,.85cqw,11px); white-space:nowrap;
}
/* .bs-slot .warn(상함 경고 !) — 은퇴 [2026-08-17 · 상함 시스템 폐지] */
/* 못 사는 칸 — 골드 부족·봇짐 참. 막는 말은 상인이 한다(기획 A-1) */
.bs-screen.bs-shop .bs-slot.no .box{ border-color:var(--c3); }
.bs-screen.bs-shop .bs-slot.no .box img{ opacity:.32; }
.bs-screen.bs-shop .bs-slot.no .pr{ color:var(--c4); }

/* ── 봇짐 ── 도매 화면에서는 8칸을 한 줄로 눕힌다 (판이 가로로 길다) ────────*/
/* [2026-08-25 · 사용자 지시 「남은 검은 칸은 사라져야 한다」]
   예전엔 늘 8칸을 그리고 못 쓰는 칸을 검게 칠했다(.bs-cell.dead). 이제 game.jsx 가
   **가진 칸(bagCap)만** 그리고, 개수를 --slots 로 넘긴다.
   🚨 칸 폭은 여전히 **8칸 기준**으로 계산한다 — repeat(3,1fr) 로 두면 3칸이 판 전체를
      나눠 먹으며 커지고, aspect-ratio:1 이라 세로로도 그만큼 자라 판을 뚫는다(실측 함정).
      그래서 폭을 calc 로 못 박고 남는 자리는 justify-content 가 먹는다.
   ⚠️ --bg-gap 을 인라인 clamp 로 되돌리지 마라 — 위 calc 가 같은 값을 읽어야 8칸일 때
      옛 배치와 픽셀 단위로 같다. */
.bs-screen.bs-shop .bs-bag{
  --bg-gap:clamp(4px,.7cqw,9px);
  display:grid; justify-content:center;
  grid-template-columns:repeat(var(--slots,8), calc((100% - 7 * var(--bg-gap)) / 8));
  gap:var(--bg-gap);
  padding:clamp(14px,2cqw,26px) clamp(8px,1.1cqw,14px) clamp(8px,1.1cqw,14px);
}
.bs-screen.bs-shop .bs-cell{
  aspect-ratio:1; min-width:0; overflow:hidden;
  border:2px dashed var(--c3); background:rgba(0,0,0,.28);
  display:flex; align-items:center; justify-content:center;
  color:var(--c3); font-size:clamp(6px,.85cqw,11px); text-align:center;
}
.bs-screen.bs-shop .bs-cell.on{ border-style:solid; border-color:var(--c4); background:#0d1408; }
.bs-screen.bs-shop .bs-cell.on img{ width:78%; height:78%; display:block; }
/* 아직 안 열린 칸 [2026-08-23 · 지시문_봇짐레벨링 【4-1】] — 「비었다」와 달라야 한다.
   ⚠️ screens.css 의 `.bs-screen .bs-cell.dead` 만으로는 안 먹는다 — 바로 위
      `.bs-screen.bs-shop .bs-cell` 과 명시도가 같아서(클래스 3개) 나중에 읽히는 이쪽이 이긴다.
      도매 화면 몫은 여기 한 줄이 반드시 있어야 한다(실측: 없으면 점선 빈 칸으로 보인다) */
.bs-screen.bs-shop .bs-cell.dead{
  border:2px solid transparent; background:rgba(0,0,0,.5); color:transparent;
}

/* ── 하단 ── 소문 띠 + 좌판 버튼 (기존 .bs-footbar 를 그대로 쓴다) ─────────*/
.bs-screen.bs-shop .bs-rumor{
  background:var(--c1); border:2px solid var(--c3); color:var(--c6);
  box-shadow:3px 3px 0 rgba(0,0,0,.5);
}
.bs-screen.bs-shop .bs-rumor b{ color:var(--c5); letter-spacing:.1em; }

/* ═══════════════════════════════════════════════════════════════════════════
   도매상 등장 차례  [2026-08-23 · 사용자 확정 「C안 · 더 여유」]
   시안: graphics\도매상등장연출_시안_0823.html · 기록: graphics\output\SHOP_INTRO_APPLY_0823.md

   여기 오기 전 이 파일에는 @keyframes 가 **한 줄도 없었다.** 배경·매물판·대사가 전부
   0초에 같이 떠서, 야콥이 걸어 들어오는 연출(charanim.css:71 bsKeeperEnter .65s)이
   그 틈에 묻혀 있었다. 그래서 「연출이 없다」기보다 **「차례가 없다」**가 정확했다.
   새로 만드는 것은 배경막·판·대사 셋뿐이고, 야콥은 **지연과 길이만** 준다.

   ⚠️ 야콥 것을 새로 만들지 마라. charanim.css 의 bsKeeperEnter 를 고치면
      매입 성공(fx-deal)·거절(fx-deny) 연출까지 같이 흔들린다.
   ⚠️ 도트 규칙 — steps() 로 끊는다. 이징·블러·둥근모서리 금지.
   ⚠️ --dur 은 **길이 배수**다. 지연(--t2~--t4)만 늘리면 여유가 아니라
      「늦게 튀어나오는 것」이 된다. 틈과 길이는 같이 늘려야 한다.
   ⚠️ JSX 수정 없음 — 네 대상 모두 이미 있는 DOM 이다.

   스킵은 **일부러 안 넣었다** (사용자 확정: 「필요한 부분에만」).
   밤 정산은 4.95초 × 12일 = 1분이라 스킵이 필수였지만(game.jsx:5566 주석),
   이 화면은 2.40초라 그 선에 못 미친다. 넣게 되면 .fin 한 클래스면 된다 —
   맨 아래 주석 참조.
   ═══════════════════════════════════════════════════════════════════════════ */
.bs-screen.bs-shop{ --t1:0s; --t2:.60s; --t2b:.95s; --t3:1.25s; --t4:2.10s; --dur:1.35 }

/* ① 배경 — 디더 막이 5단으로 걷힌다. 마을 로비와 같은 문법(town.css:113) */
.bs-screen.bs-shop::after{
  content:""; position:absolute; inset:0; z-index:11; pointer-events:none;
  background-color:#0d1108;
  background-image:repeating-linear-gradient(45deg, rgba(0,0,0,.5) 0 2px, rgba(0,0,0,0) 2px 4px);
  animation:bsShopIn calc(.42s * var(--dur)) steps(5) var(--t1) forwards;
}
@keyframes bsShopIn{ from{opacity:1} to{opacity:0} }

/* ② 매물판 — 아래에서 한 뼘 올라오며. 판이 크니 먼저 자리를 잡는다 */
.bs-screen.bs-shop .bs-shop-list{
  animation:bsShopPlate calc(.26s * var(--dur)) steps(3) var(--t2) both;
}
@keyframes bsShopPlate{ from{opacity:0; transform:translateY(3%)} to{opacity:1; transform:none} }

/* ②-b 봇짐 판 — 매물판이 자리를 잡은 **뒤에** 담을 곳이 온다
   [2026-08-23 · 인계_도매상봇짐판등장 · 사용자 보고 「봇짐이 그냥 틱 나와있어」]
   여기 없었던 탓에 0초부터 떠 있었다 — 살 곳(매물판)보다 담을 곳(봇짐)이 먼저인 거꾸로 된 그림.
   ⚠️ 새 keyframes 를 만들지 마라. 매물판과 **같은 결**이라야 한 벌로 읽힌다.
   ⚠️ 전체 길이는 안 늘어난다 — 0.95~1.30 은 야콥(--t3 1.25s)과 겹치는 자리라 여전히 2.40초다.
   ⚠️ build.css:631 의 .bs-bagbox.pop(0,4,0)이 이 규칙(0,3,0)을 이긴다 —
      봇짐 획득·갈아타기 팝(bsBagPop)은 그대로 돈다. 순서 무관 */
.bs-screen.bs-shop .bs-bagbox{
  animation:bsShopPlate calc(.26s * var(--dur)) steps(3) var(--t2b) both;
}

/* ③ 야콥 — 있는 것을 미루고 늘리기만 한다. 혼자 빠르면 다른 셋과 결이 안 맞는다 */
.bs-screen.bs-shop .bs-keeper-fx.fx-enter{
  animation-delay:var(--t3); animation-fill-mode:both;
  animation-duration:calc(.65s * var(--dur));
}
.bs-screen.bs-shop .bs-keeper-wrap.orc .bs-keeper-fx.fx-enter{
  animation-duration:calc(.78s * var(--dur));   /* 그라샤는 원래 더 느리다 */
}

/* ④ 대사판 — 야콥이 다 선 뒤에 말한다 */
.bs-screen.bs-shop .bs-keepsay{
  animation:bsKeepSay calc(.22s * var(--dur)) steps(3) var(--t4) both;
}
@keyframes bsKeepSay{ from{opacity:0; transform:translateY(6%)} to{opacity:1; transform:none} }

/* ── 붙들기 ── [2026-08-23 · 사용자 결재 B안 · 원화 graphics\output\DAY_TRANS_APPLY_0823.md]
   아침 도매상은 DAY 카드와 **같은 순간에** 켜진다. 카드가 3.9초를 덮는 동안 이 2.40초짜리
   등장 차례가 통째로 지나가 버려서, 덮개가 걷히면 야콥이 **이미 다 걸어 들어와 말까지 마친 채**
   서 있었다. 카드가 걷히기 시작할 때까지 여기를 0초에 멈춰 둔다.
   짝: game.jsx 의 dayHold — showDay() 가 켜고 dayLift() 가 끈다.
   🚨 animation:none 으로 끄지 마라. ::after 는 기본이 **불투명**이고 그걸 걷어내는 게
      애니메이션이라, 끄면 화면이 영영 까맣게 덮인 채 남는다.
      **animation-play-state:paused** 여야 한다 — 지연까지 함께 멈추므로, 풀면 0초부터 다시 흐른다.
   ⚠️ 저녁 도매상(shopFrom "town")에는 카드가 없어 dayHold 가 false 다 — 이 규칙이 안 걸린다. */
.bs-screen.bs-shop.bs-hold::after,
.bs-screen.bs-shop.bs-hold .bs-shop-list,
.bs-screen.bs-shop.bs-hold .bs-bagbox,
.bs-screen.bs-shop.bs-hold .bs-keeper-idle,
.bs-screen.bs-shop.bs-hold .bs-keeper-fx,
.bs-screen.bs-shop.bs-hold .bs-keepsay{ animation-play-state:paused }

/* 🚨 움직임 줄이기 — 배경막은 **반드시** opacity:0 으로 걷어 둬라.
   기본값이 불투명이고 그걸 걷어내는 게 애니메이션이라, 애니메이션만 끄면
   화면이 영영 까맣게 덮인 채 남는다 (town.css:125 에 같은 사고 기록이 있다). */
@media (prefers-reduced-motion: reduce){
  .bs-screen.bs-shop::after{ animation:none; opacity:0 }
  .bs-screen.bs-shop .bs-shop-list,
  .bs-screen.bs-shop .bs-bagbox,
  .bs-screen.bs-shop .bs-keepsay{ animation:none }
  .bs-screen.bs-shop .bs-keeper-fx.fx-enter{ animation:none }
}

/* 스킵이 필요해지면 이 블록만 살리고 game.jsx 의 .bs-screen.bs-shop 에
   onClick 으로 "fin" 클래스를 붙였다 phase 가 바뀔 때 떼면 된다.
   (.bs-permitfx .fin 이 쓰는 것과 같은 문법)
.bs-screen.bs-shop.fin::after,
.bs-screen.bs-shop.fin .bs-shop-list,
.bs-screen.bs-shop.fin .bs-bagbox,
.bs-screen.bs-shop.fin .bs-keepsay,
.bs-screen.bs-shop.fin .bs-keeper-fx.fx-enter{
  animation-delay:0s !important; animation-duration:.01s !important;
} */


/* ══ 야콥 말칸을 전폭으로 ══ [2026-08-25 · 사용자 지시 「야콥 글자칸이 너무 작음 … 말칸 길게」]
   위 §「상인 대사」의 `left:2.2%; width:34%` 를 여기서 덮는다. 원본 규칙은 경위가 붙어 있어
   지우지 않고 남겨 뒀다 — **이 블록이 뒤에 있어서** 이긴다(명시도 동률, 순서로 갈린다).

   왜 이제야 되나 — 그 34% 는 아래 소문 띠를 피하느라 나온 폭이 아니라, 소문 띠가 하단
   전폭을 쓰고 있었기 때문에 남은 자리였다. 소문 띠를 뺐으니(game.jsx 【4】) 하단이 비었다.
   자리·크기는 튜토리얼 대사창(.bs-tutsay, build.css:411)을 그대로 따른다 — 같은 화면에서
   번갈아 뜨는 두 창이라 규격이 다르면 야콥이 갑자기 작아졌다 커진다.

   ⚠️ 되살릴 일이 생기면 소문 띠와 **둘 중 하나만** 골라라. 같은 자리를 놓고 다툰다.
   ⚠️ bottom 을 3.4%(=.bs-footbar) 로 내리지 마라 — 「장터로 나선다」 버튼과 겹친다.
      버튼 줄 높이 + 틈을 px 하한으로 함께 걸어야 작은 창에서도 안 물린다. */
.bs-screen.bs-shop .bs-keepsay{
  left:2.5%; right:2.5%; width:auto;
  /* 실측 2026-08-25 (무대 1284x724) — 「장터로 나선다」 줄은 top 639 에 앉는다.
     bottom 을 9.6%(=654) 로 뒀더니 19px 물렸다. 13.4%(=627) 로 12px 띄운다.
     위쪽 여유: 봇짐 판이 477 에서 끝나므로 대사가 세 줄(약 145px)로 늘어도 482 라 안 닿는다.
     ⚠️ 이름표(.bs-keeptab)는 판 왼쪽 위(x≈32)라 봇짐 판(x≥488)과 가로로 안 겹친다 — 세로만 보면 된다. */
  bottom:clamp(74px,13.4%,118px);
  font-size:clamp(10px,1.7cqw,20px); line-height:1.65;
  padding:clamp(9px,1.5cqw,18px) clamp(13px,2cqw,26px) clamp(10px,1.6cqw,19px);
}
.bs-screen.bs-shop .bs-keeptab{
  top:calc(-1 * clamp(14px,2.2cqw,21px));
  padding:1px clamp(10px,1.6cqw,18px); font-size:clamp(9px,1.45cqw,17px);
}

/* .bs-rumor — 은퇴 [2026-08-25]. 규칙은 남겨 둔다(밤 정산 .bs-night-wrap .bs-rumor 는 그대로 산다).
   도매 화면에서만 안 그린다 — game.jsx 하단 주석 참조 */