#screen-stage-select{
  background:
    linear-gradient(180deg,rgba(255,255,255,.15),rgba(40,80,30,.12)),
    url("../assets/ui/lobby_bg.png") center/cover no-repeat;
}
.stage-select-body{flex:1;display:flex;flex-direction:row;gap:var(--gap-3);padding:var(--gap-3);min-height:0}
.stage-node-map{
  flex:1.2;overflow-y:auto;overflow-x:hidden;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));
  gap:var(--gap-3);align-content:start;
  /* 동료 뱃지가 위로/왼쪽으로 삐져나와도 잘리지 않게 */
  padding:14px 10px 10px 12px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.stage-node-map::-webkit-scrollbar{display:none;width:0;height:0}

.chapter-divider{
  grid-column:1 / -1;
  font-family:var(--font-display);font-size:var(--fs-lg);color:var(--cream);
  text-shadow:0 2px 0 rgba(0,0,0,.25);
  background:linear-gradient(90deg,rgba(90,55,25,.55),rgba(90,55,25,.15));
  border:2px solid rgba(255,248,235,.28);border-radius:14px;
  padding:8px 14px;margin-top:4px;
}
.stage-node{
  /* overflow:hidden 이면 unlock-mark 가 잘림 — 배경 라운드는 border-radius 로 충분 */
  position:relative;overflow:visible;min-height:84px;border-radius:18px;
  border:3px solid var(--brown);
  background:linear-gradient(180deg,#fffef8 0%,#ffe9c4 55%,#f0d8a8 100%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.6),0 4px 0 rgba(90,55,25,.22);
  transition:transform .1s,box-shadow .1s,filter .15s;
}
.stage-node::after{
  content:"";position:absolute;left:14%;right:14%;top:3px;height:30%;
  border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.5),transparent);pointer-events:none;
}
.stage-node b{font-size:var(--fs-xl);color:var(--green-dark);position:relative;z-index:1}
.stage-node small{font-size:var(--fs-xs);color:var(--ink-soft);position:relative;z-index:1;line-height:1.2}
.stage-node.cleared{background:linear-gradient(180deg,#f0ffd8,#c8f0a0 60%,#a8dc78)}
.stage-node.cleared::before{
  content:"★";position:absolute;top:4px;right:8px;z-index:1;
  color:var(--orange);font-size:14px;text-shadow:0 1px 0 rgba(0,0,0,.15);
}
.stage-node.locked{opacity:.55}
.stage-node.locked b,.stage-node.locked small{filter:grayscale(1)}
.stage-node.locked .unlock-mark{filter:none;opacity:1}
.stage-node.boss{
  border-color:var(--purple-dark);
  background:linear-gradient(180deg,#f8f0ff,#e4d4fb 60%,#d0b8f0);
}
.stage-node.boss b{color:var(--purple-dark)}
.stage-node.selected{outline:3px solid var(--orange);outline-offset:2px;transform:translateY(-2px)}
.stage-node:not(:disabled):hover{filter:brightness(1.04)}
.stage-node:not(:disabled):active{transform:translateY(2px);box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 1px 0 rgba(90,55,25,.22)}
.stage-node .unlock-mark{
  position:absolute;top:-10px;left:-6px;z-index:3;
  background:linear-gradient(180deg,var(--purple-hi),var(--purple));color:#fff;
  font-size:11px;font-family:var(--font-display);
  border-radius:999px;padding:2px 8px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 2px 0 var(--purple-dark);
  pointer-events:none;white-space:nowrap;
}

.stage-detail{
  flex:1;min-width:0;min-height:0;
  background:linear-gradient(180deg,rgba(255,253,247,.96),rgba(255,248,235,.96));
  border:4px solid var(--brown);border-radius:var(--radius-lg);
  padding:0;overflow:hidden;
  display:flex;flex-direction:column;
  box-shadow:var(--shadow-soft);
  position:relative;
}
.stage-detail-body{
  flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;
  padding:var(--gap-4) var(--gap-4) 12px;
  display:flex;flex-direction:column;gap:var(--gap-3);
  scrollbar-width:thin;
  scrollbar-color:rgba(90,55,25,.35) transparent;
}
.stage-detail-body::-webkit-scrollbar{width:8px}
.stage-detail-body::-webkit-scrollbar-thumb{
  background:rgba(90,55,25,.35);border-radius:999px;
}
.stage-detail-foot{
  flex-shrink:0;
  padding:10px var(--gap-4) 12px;
  background:linear-gradient(180deg,rgba(255,248,235,.92),rgba(255,240,214,.98));
  border-top:2px solid rgba(90,55,25,.14);
  box-shadow:0 -8px 18px rgba(70,48,20,.08);
}
.stage-detail-foot .primary-btn{
  width:100%;margin:0;
}
.stage-detail-empty{
  color:#a08a60;margin:auto;font-size:var(--fs-md);padding:var(--gap-4);text-align:center;
}
.stage-detail h2{font-size:var(--fs-xl)}
.stage-detail h3{font-size:var(--fs-md);color:var(--green-dark);font-family:var(--font-display)}
.stage-detail .meta-line{font-size:var(--fs-sm);color:var(--ink-soft);line-height:1.4}
.preview-enemies{display:flex;gap:var(--gap-2);flex-wrap:wrap}
.preview-enemies img{
  width:52px;height:52px;
  object-fit:contain;object-position:center bottom;
  background:var(--green-soft);
  border-radius:14px;border:2px solid var(--brown-light);padding:3px;
  box-sizing:border-box;
}
.reward-line{
  font-size:var(--fs-sm);line-height:1.45;background:var(--orange-soft);
  border-radius:12px;padding:10px 12px;border:2px dashed var(--orange);
}
.party-preview{display:flex;gap:var(--gap-1);flex-wrap:wrap}
.party-preview img{
  width:40px;height:40px;
  object-fit:contain;object-position:center bottom;
  border-radius:10px;
  background:var(--green-soft);border:2px solid var(--green);
  padding:2px;box-sizing:border-box;
}