/* 로비 — 노선도 · 도감 · 덱. 색 토큰은 skin.css 것을 그대로 쓴다 */
#lob{position:relative;max-width:480px;height:100%;margin:0 auto;display:flex;flex-direction:column;background:#101113;overflow:hidden}
#lob header{position:relative;z-index:5;display:flex;align-items:center;gap:8px;height:52px;padding:0 12px;
  background:linear-gradient(#0D0C10,#16151A);border-bottom:2px solid var(--red2)}
#lob header h1{flex:1 1 auto;min-width:0;margin:0;white-space:nowrap;font:clamp(16px,5.2vw,22px) 'Black Han Sans',sans-serif;letter-spacing:.5px}   /* 줄바꿈 금지 — 혼불 세 자리에서 「막차 맞/고」로 끊겼다(2026-10-13) */
#lob header h1 b{color:var(--red)}
.pill{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 10px;border-radius:15px;background:var(--ink3);font:14px 'Black Han Sans',sans-serif;color:var(--gold)}
.pill.c{color:var(--paper)}
#regions{display:flex;gap:6px;padding:8px 10px;overflow-x:auto;scrollbar-width:none;background:#141317}
#regions button{flex:0 0 auto;min-height:36px;padding:0 14px;border-radius:18px;border:1.5px solid #3A3840;background:transparent;color:var(--muted);font:15px 'Black Han Sans',sans-serif}
#regions button.on{background:var(--paper);color:var(--ink);border-color:var(--paper)}
#regions button em{font-style:normal;font-size:13px;margin-left:4px;opacity:.75}
.view{position:relative;flex:1;min-height:0;display:none}
.view.on{display:block}
/* 노선도 */
#mapWrap{position:absolute;inset:0;overflow:hidden;touch-action:none;
  background:
    radial-gradient(1.5px 1.5px at 12% 18%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1.5px 1.5px at 78% 12%, rgba(255,255,255,.45), transparent 60%),
    radial-gradient(1px 1px at 46% 64%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(1.5px 1.5px at 88% 72%, rgba(255,255,255,.4), transparent 60%),
    radial-gradient(1px 1px at 24% 86%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(120% 85% at 50% 30%, #4B4570 0%, #35305A 45%, #241F3C 100%)}   /* 밝은 남보라 밤하늘(2026-10-13 「너무 어둡다」) */
#map{width:100%;height:100%;display:block;will-change:transform}   /* 10-23 지도 그림을 따로 층으로 — 위의 단추·구슬이 움직여도 다시 안 그린다 */
#mapFx{position:absolute;inset:0;pointer-events:none;overflow:hidden;will-change:transform}   /* 갈 역 구슬 층(2026-10-14) — div 라 움직임이 그래픽 쪽에서 돈다 */
#mapFx .od{position:absolute;left:0;top:0;box-sizing:border-box;border-radius:50%;border:3.5px solid #fff;background:var(--gold);will-change:scale,translate}
#mapFx .od i{position:absolute;inset:-3px;border-radius:50%;box-shadow:0 0 0 3px rgba(255,236,190,.9);opacity:0;will-change:opacity;animation:odGlow 1.4s ease-in-out infinite}
#mapFx .od::before{content:"";position:absolute;left:16%;top:12%;width:34%;height:22%;border-radius:50%;background:rgba(255,255,255,.75)}
#mapFx .od{animation:odSquish 1.4s ease-in-out infinite}
@keyframes odSquish{0%,100%{scale:1 1}30%{scale:1.14 .88}55%{scale:.92 1.1}75%{scale:1.04 .97}}   /* 말랑 — 예전 dotSquish 와 같은 값 */
@keyframes odGlow{50%{opacity:1}}
#map .seg{stroke-linecap:round;fill:none}
#map .seg.glow{opacity:.18}   /* 흐림 효과는 뺐다 — 확대할 때마다 다시 계산돼 느렸다 */
#map .seg.dim{opacity:.38}
#map .seg.glow.done{stroke:#F5C542;opacity:.55}   /* 10-28 완주한 노선 — 금빛 테(움직이지 않는다: 큰 그림 위 반짝임은 전체를 다시 그린다) */
#map .dot .body,#mapFx .dot .body{stroke-width:3.5}   /* 구슬 765개 그림자 효과는 뺐다(확대 속도) */
#map .dot .shine,#mapFx .dot .shine{fill:rgba(255,255,255,.75);pointer-events:none}
#map .dot.lock .body{fill:#3E3863;stroke:#8F87BF;stroke-width:2.5}
#map .dot.lock .shine{fill:rgba(255,255,255,.35)}
#map .dot.clear .body{fill:var(--lc,#888);stroke:#fff}
#mapFx .dot.open .body{fill:var(--gold);stroke:#fff}
#mapFx .dot.open .sq{animation:dotSquish 1.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
#mapFx .dot.open .body{animation:openGlow 1.4s ease-in-out infinite}
@keyframes dotSquish{0%,100%{scale:1 1}30%{scale:1.14 .88}55%{scale:.92 1.1}75%{scale:1.04 .97}}   /* 말랑 — 젤리처럼 통통 */
@keyframes openGlow{50%{stroke:rgba(255,236,190,.9);stroke-width:6}}
#map .hit,#mapFx .hit{fill:transparent;cursor:pointer}
#map text{font:600 13px 'Noto Sans KR',sans-serif;font-size:var(--fs,13px);fill:#D8D2EE;paint-order:stroke;stroke:#2A2546;stroke-width:var(--fsw,4px);pointer-events:none}
#map text.open{fill:#FFD98A;font-weight:700}
#map text.clear{fill:#FFFFFF}
#map text.far{display:none}
#map #lb.zoomed text.far{display:inline}
.mapBtns{position:absolute;right:10px;bottom:84px;z-index:3;display:flex;flex-direction:column;gap:8px}
.mapBtns button{width:44px;height:44px;border-radius:12px;border:0;background:rgba(30,29,35,.92);color:var(--paper);font-size:20px;box-shadow:0 4px 12px rgba(0,0,0,.5)}
#nextBtn{position:absolute;left:12px;right:68px;bottom:16px;z-index:3;min-height:56px;border:0;border-radius:14px;
  background:var(--red);color:#fff;font:19px 'Black Han Sans',sans-serif;box-shadow:0 6px 18px rgba(211,39,29,.4),0 3px 0 var(--red2)}
#nextBtn small{display:block;font:13px 'Noto Sans KR',sans-serif;opacity:.9}
.mapStat{position:absolute;left:12px;top:10px;z-index:3;padding:6px 10px;border-radius:10px;background:rgba(14,14,17,.85);font-size:13px;color:var(--muted)}
.mapStat b{color:var(--paper);font-family:'Black Han Sans',sans-serif;font-weight:400}
/* 아래 탭 */
#tabs{display:flex;background:#0D0C10;border-top:1px solid #26252B;padding-bottom:env(safe-area-inset-bottom)}
#tabs button{flex:1;min-height:58px;border:0;background:none;color:var(--muted);font:14px 'Black Han Sans',sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
#tabs button i{font-style:normal;font-size:20px;filter:grayscale(1);opacity:.6}
#tabs button.on{color:var(--paper)}
#tabs button.on i{filter:none;opacity:1}
/* 귀신 카드(로비용) */
.gc{color:var(--paper);position:relative;aspect-ratio:3/4;border-radius:8px;overflow:hidden;background:#000 center/cover;box-shadow:0 0 0 1.5px var(--gb,#55525C),0 4px 10px rgba(0,0,0,.5)}
.gc.no{background:#0E0D11;box-shadow:0 0 0 1.5px #2A2930}   /* 2026-10-08 filter 제거(빈 칸 461개에 걸려 스크롤 렉) */
.gc.no::after{content:"?";position:absolute;inset:0;display:grid;place-items:center;font:34px 'Black Han Sans',sans-serif;color:#888;filter:none}
.gc .g{position:absolute;left:4px;top:4px;padding:1px 5px;border-radius:4px;font:13px 'Black Han Sans',sans-serif;background:var(--gb,#55525C);color:#fff}
.gc .n{position:absolute;left:0;right:0;bottom:0;padding:12px 4px 4px;font:13px 'Black Han Sans',sans-serif;text-align:center;background:linear-gradient(transparent,rgba(0,0,0,.85))}
.gc .lv{position:absolute;right:4px;top:4px;font:13px 'Black Han Sans',sans-serif;color:var(--gold)}
.gc.new::before{content:"NEW";position:absolute;right:4px;top:4px;z-index:2;padding:1px 4px;border-radius:3px;background:var(--red);font:13px 'Black Han Sans',sans-serif}
.g-N{--gb:#6B6870}.g-R{--gb:#2F7E68}.g-SR{--gb:#3762B8}.g-SSR{--gb:#8A3DB8}.g-UR{--gb:#C9861C}
/* 도감 · 덱 */
.scroll{position:absolute;inset:0;overflow-y:auto;padding:12px 12px 24px;-webkit-overflow-scrolling:touch}
.chips{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}
.chips button{flex:0 0 auto;min-height:36px;padding:0 12px;border-radius:18px;border:1.5px solid #3A3840;background:transparent;color:var(--muted);font:14px 'Black Han Sans',sans-serif}
.chips button.on{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.prog{display:flex;align-items:baseline;gap:8px;margin:2px 0 10px}
.prog b{font:26px 'Black Han Sans',sans-serif}
.prog .bar{flex:1;height:8px;border-radius:4px;background:#26252B;overflow:hidden}
.prog .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--red2),var(--red))}
/* 명부 단계(10-21 수집만으로 보상) */
.mbBox{margin:0 0 12px;padding:10px 12px;border-radius:12px;background:#1E1D22;border:1.5px solid #3A3840}
.mbTop{display:flex;align-items:center;gap:8px}
.mbTop b{font:17px 'Black Han Sans',sans-serif;color:var(--gold)}
.mbTop span{margin-left:auto;font-size:13px;color:#B9B2A3}
.mbBox .bar{height:8px;margin:7px 0 6px;border-radius:4px;background:#26252B;overflow:hidden}
.mbBox .bar i{display:block;height:100%;background:linear-gradient(90deg,#B8902E,var(--gold))}
.mbBox p{margin:0;font-size:13px;line-height:1.45;word-break:keep-all;color:#EDE6D6}   /* 바탕이 늘 어두워 테마와 상관없이 밝은 글자 */
.mbBox p.mbNx{margin-top:3px;color:#B9B2A3}
.skLight{display:inline-block;margin-top:4px;font-size:13px;line-height:1.4;color:var(--muted)}
.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:6px}
.slot3{position:relative;aspect-ratio:3/4;border-radius:10px;border:2px dashed #3A3840;display:grid;place-items:center;color:#5A5860;font:14px 'Black Han Sans',sans-serif}
.slot3 .gc{position:absolute;inset:0}
.skl{margin:2px 0 0;font-size:13px;line-height:1.35;color:var(--muted);text-align:center;min-height:32px}
.slot3.lock{border-style:solid;border-color:#2A2830;background:repeating-linear-gradient(45deg,#16151A 0 8px,#1B1A20 8px 16px);color:#6A6870;font-size:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.slot3.lock small{font:13px 'Black Han Sans',sans-serif;color:#8A8790}
.setNote{border-left:3px solid var(--gold)}
.cbNote{border-left:3px solid #7FD3B0}
/* 카드 창 — 고유 스킬 · 짝꿍(10-21) */
.cxBox{margin:10px 0 0;display:grid;gap:6px}
.cxRow{padding:8px 10px;border-radius:10px;background:rgba(127,211,176,.12);border-left:3px solid #7FD3B0}
.cxRow.uq{background:rgba(201,160,255,.14);border-left-color:#C9A0FF}
.cxRow b{display:block;font-size:14px}
.cxRow span{display:block;margin-top:2px;font-size:13px;line-height:1.45;word-break:keep-all;opacity:.9}
.skl b{color:var(--paper);font-family:'Black Han Sans',sans-serif;font-weight:400}
.secT{margin:16px 0 8px;font:16px 'Black Han Sans',sans-serif;color:var(--paper)}
.empty{padding:40px 12px;text-align:center;color:var(--muted);line-height:1.6}
.gc.eq{box-shadow:0 0 0 3px var(--gold),0 4px 10px rgba(0,0,0,.5)}
/* 역 창 */
.stHead{display:flex;gap:14px;align-items:flex-start}
.stHead .gc{flex:0 0 112px}
.stHead .ln2{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:12px;padding:0 7px;color:#fff;font:13px 'Black Han Sans',sans-serif}
.stHead h3{margin:6px 0 2px}
.stHead .meta{font-size:14px;color:#6A6055;line-height:1.5}
.stHead .meta b{color:var(--paper-ink)}
.tag{display:inline-block;padding:2px 8px;border-radius:5px;font:13px 'Black Han Sans',sans-serif;color:#fff;margin-right:4px}
.lvTag{background:#3C3833}
.intro{margin:12px 0 14px;padding:10px 12px;border-left:3px solid var(--red);background:rgba(43,38,32,.06);font-size:14px;line-height:1.55;color:#4A4239;white-space:pre-line}

/* ── 상점 ── */
.pill.hon{color:#FF8A5C}
#lob header .pill{padding:0 8px;font-size:13px}
.shTabs{display:flex;gap:6px;margin-bottom:10px}
.shTabs button{flex:1;min-height:44px;border-radius:12px;border:1.5px solid #3A3840;background:transparent;color:var(--muted);font:15px 'Black Han Sans',sans-serif}
.shTabs button.on{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.shWallet{display:flex;gap:10px;margin-bottom:10px}
.shWallet span{flex:1;padding:10px 12px;border-radius:12px;background:#1B1A20;font-size:13px;color:var(--muted)}
.shWallet b{font:18px 'Black Han Sans',sans-serif;color:var(--paper);font-weight:400}
.shPick{margin-bottom:10px;padding:10px 12px;border-radius:12px;background:linear-gradient(90deg,rgba(232,182,76,.18),transparent);font-size:13px;color:var(--paper)}
.shPick b{color:var(--gold)}
.shBox{margin-bottom:12px;padding:14px;border-radius:16px;background:#1B1A20;box-shadow:inset 0 0 0 1.5px #2E2D34}
.shBox.premium{background:linear-gradient(160deg,#2A1416,#17151A);box-shadow:inset 0 0 0 1.5px rgba(211,39,29,.5)}
.shHead{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.shHead b{font:20px 'Black Han Sans',sans-serif;font-weight:400}
.shHead em{font:13px 'Black Han Sans',sans-serif;font-style:normal;color:#fff;background:var(--red);border-radius:5px;padding:2px 6px}
.shRate{display:flex;flex-wrap:wrap;gap:4px 10px;font:13px 'Black Han Sans',sans-serif}
.shRate i{font-style:normal;color:var(--gb)}
.shSub{margin:4px 0 12px;font-size:13px;color:var(--muted)}
.shSub b{color:var(--paper)}
.shBox .btn small{font-size:13px}
.shLink{display:block;margin:4px auto 0;min-height:44px;padding:0 16px;border:0;background:none;color:var(--muted);text-decoration:underline;font-size:14px}
.shNote{margin:6px 0 12px;font-size:13px;line-height:1.55;color:var(--muted)}
.shNote b{color:var(--paper)}
.shNote.warn{padding:10px 12px;border-radius:10px;background:rgba(232,182,76,.1);color:var(--gold)}
.shRow{display:flex;align-items:center;gap:12px;margin-bottom:10px;padding:12px;border-radius:14px;background:#1B1A20}
.shRow .ic{font-size:26px}
.shRow > div{flex:1;min-width:0;font-size:15px}
.shRow > div b{font-family:'Black Han Sans',sans-serif;font-weight:400}
.shRow small{color:var(--muted);font-size:13px}
.shRow em{margin-left:6px;font:13px 'Black Han Sans',sans-serif;font-style:normal;color:var(--gold);border:1px solid var(--gold);border-radius:4px;padding:0 4px}
.shRow .btn{flex:0 0 auto;min-height:48px;min-width:118px;padding:0 10px;font-size:15px}
.shRow .btn[disabled]{opacity:.55}
.shToast{pointer-events:none;position:fixed;left:50%;top:40%;transform:translateX(-50%);z-index:200;padding:12px 20px;border-radius:24px;background:var(--paper);color:var(--ink);font:16px 'Black Han Sans',sans-serif;box-shadow:0 8px 24px rgba(0,0,0,.5);animation:chip 1.8s ease-out forwards;white-space:nowrap}
/* 뽑기 결과 */
.gaDim{position:fixed;inset:0;z-index:150;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px;
  background:radial-gradient(80% 60% at 50% 45%,rgba(60,20,20,.92),rgba(5,5,8,.97))}
.gaDim.big{background:radial-gradient(80% 60% at 50% 45%,rgba(120,80,20,.9),rgba(5,5,8,.97))}
.gaTitle{font:24px 'Black Han Sans',sans-serif;color:var(--paper)}
.gaGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%;max-width:420px}
.gaGrid.n1{grid-template-columns:1fr;max-width:200px}
.gaCard{aspect-ratio:3/4;perspective:600px}
.gaIn{position:relative;width:100%;height:100%;transition:transform .45s cubic-bezier(.2,.8,.2,1);transform-style:preserve-3d}
.gaCard.on .gaIn{transform:rotateY(180deg)}
.gaBack,.gaFront{position:absolute;inset:0;border-radius:8px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.gaBack{display:grid;place-items:center;background:var(--back);box-shadow:0 0 0 1.5px #3A3840}
.gaBack b{font:14px 'Black Han Sans',sans-serif;color:var(--paper)}
.gaFront{transform:rotateY(180deg);background:#000 center/cover;box-shadow:0 0 0 2px var(--gb)}
.gaCard.on.g-SR .gaFront{box-shadow:0 0 0 2px var(--gb),0 0 14px var(--gb)}
.gaCard.on.g-SSR .gaFront,.gaCard.on.g-UR .gaFront{box-shadow:0 0 0 3px var(--gb),0 0 26px var(--gb);animation:gaGlow 1.2s ease-in-out infinite}
@keyframes gaGlow{50%{filter:brightness(1.25)}}
.gaFront .g{position:absolute;left:3px;top:3px;padding:0 4px;border-radius:3px;background:var(--gb);font:13px 'Black Han Sans',sans-serif;color:#fff}
.gaFront .nw{position:absolute;right:3px;top:3px;padding:0 3px;border-radius:3px;background:var(--red);font:13px 'Black Han Sans',sans-serif;color:#fff}
.gaFront .n{position:absolute;left:0;right:0;bottom:0;padding:8px 2px 2px;font:13px 'Black Han Sans',sans-serif;text-align:center;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.85))}
.gaGrid.n1 .gaFront .n{font-size:16px}
.gaGrid.n1 .gaFront .g{font-size:14px}
.gaBtns{display:flex;gap:10px;width:100%;max-width:420px}
.gaBtns .btn{flex:1}
/* 어두운 바탕 위 테두리 단추는 밝은 글자로 (패키지 가격·「모두 보기」가 안 보이던 것) */
.shRow .btn.line,.gaBtns .btn.line,.slots + .btns .btn.line{color:var(--paper);box-shadow:inset 0 0 0 2px rgba(242,235,221,.55)}

/* 2026-10-05 — 누르는 높이 44px · 덱 같은 계열 표시 */
#regions button,.chips button{min-height:44px}
.slot3.off .gc{filter:grayscale(1) brightness(.55)}
.gc[data-bg]{background-color:#1A191E}
.shRow .btn[aria-disabled=true]{opacity:.55}
/* 겹친 환승역 노선 고르기(2026-10-06) */
.lnPick{flex-direction:column}
.lnPick .btn{display:flex;align-items:center;justify-content:flex-start;gap:8px;min-height:52px;text-align:left}
.lnPick .btn small{margin-left:auto}
.lnPick .ln2{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:12px;padding:0 7px;color:#fff;font:13px 'Black Han Sans',sans-serif}

/* 정렬 줄 (2026-10-08) */
.sortBar{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 0 10px}
.sortBar::-webkit-scrollbar{display:none}
.sortBar span{flex:0 0 auto;font-size:13px;color:var(--muted);margin-right:2px}
.sortBar button{flex:0 0 auto;min-height:44px;padding:0 10px;border:0;border-radius:8px;background:#1C1B20;color:var(--muted);font:13px 'Black Han Sans',sans-serif}
.sortBar button.on{background:#2E2C34;color:var(--gold);box-shadow:inset 0 -2px 0 var(--gold)}
.grid .gc{contain:layout paint;box-shadow:0 0 0 1.5px var(--gb,#55525C)}   /* 격자는 번지는 그림자 없이(461칸 그리기 부담) */
.grid .gc.eq{box-shadow:0 0 0 3px var(--gold)}
.grid .gc.no{box-shadow:0 0 0 1.5px #2A2930}

/* 판돈 (2026-10-12) — 역 창 점당·성격 · 모자랄 때 · 구휼 · 카드 사기 */
.stStake{display:flex;flex-direction:column;gap:2px;margin:10px 0 2px;padding:10px 12px;border-radius:10px;background:#1C1B20;color:#E9E0CF;font-size:14px}
.stStake b{color:var(--gold);font:16px 'Black Han Sans',sans-serif}
.stStake span{font-size:13px;color:var(--muted)}
.stRole{margin-top:10px;padding:8px 12px;border-radius:10px;font:15px 'Black Han Sans',sans-serif;background:#3A1A1C;color:#FF8A7E;box-shadow:inset 0 0 0 1.5px rgba(211,39,29,.5)}
.stRole.boss{background:#4A1418;color:#FFB3A8}
.stRole.hub{background:#3A1A4A;color:#E8C6FF}   /* 큰 역 귀신(UR·SSR 환승역, 2026-10-13) */
.shortL{display:flex;flex-direction:column;gap:8px;margin:12px 0 4px}
.shortL .btn{width:100%;min-height:52px}
.shortL .btn[aria-disabled=true]{opacity:.45}
.aidEv{display:flex;gap:14px;align-items:center}
.aidEv .gc{flex:0 0 96px}
.aidT{font:13px 'Black Han Sans',sans-serif;color:var(--gold);letter-spacing:.08em}
.aidAmt{margin:14px 0 6px;text-align:center;font-size:18px}
.aidAmt b{font:34px 'Black Han Sans',sans-serif;color:var(--gold)}
.buyRow{margin-top:10px}.buyRow .btn{width:100%;min-height:52px}
.buyRow .btn[aria-disabled=true]{opacity:.45}

/* 출석 7일 (유료화 v2, 2026-10-12) */
.atP{font-size:14px;color:var(--muted)}
.atG{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0 6px}
.atC{position:relative;min-height:84px;padding:8px 4px;border-radius:10px;background:#E8DFD0;text-align:center;display:flex;flex-direction:column;justify-content:center;gap:4px}
.atC span{font:13px 'Black Han Sans',sans-serif;color:#7A6F60}
.atC b{font-size:13px;line-height:1.35;color:#2B2620}
.atC.big{grid-column:span 2;background:#F3D9A4;box-shadow:inset 0 0 0 2px var(--gold)}
.atC.now{box-shadow:inset 0 0 0 3px var(--red);background:#FBEDE0}
.atC.got{opacity:.55}
.atC i{position:absolute;right:6px;top:4px;font-style:normal;color:var(--red);font:16px 'Black Han Sans',sans-serif}

.shTicket{width:100%;margin-top:8px;min-height:48px}

/* 정통 맞고 표시 — 역 창 (2026-10-13) */
.stClassic{margin:10px 0 0;padding:8px 12px;border-radius:10px;background:#2B2620;color:#F2EADB;font-size:14px;word-break:keep-all}
.stClassic small{display:block;margin-top:2px;font-size:13px;color:#B8AC98}

/* 이벤트 띠·이벤트 창 (2026-10-13 js/events.js) */
#evBar{position:absolute;left:12px;top:48px;z-index:3;display:flex;align-items:center;gap:6px;max-width:calc(100% - 24px);min-height:44px;padding:6px 12px;border:0;border-radius:12px;background:rgba(43,38,32,.92);color:#F2EADB;font-size:14px;text-align:left;box-shadow:0 4px 14px rgba(0,0,0,.4)}
#evBar span{font-size:16px;letter-spacing:1px}
#evBar b{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#evBar i{font-style:normal;font-size:13px;padding:1px 6px;border-radius:8px;background:rgba(255,255,255,.14)}
#evBar.hot{background:#B2291F}
/* 오늘의 일 단추 · 창(10-21 js/daily.js) */
#dayBar{position:absolute;right:12px;top:48px;z-index:3;display:flex;align-items:center;gap:4px;min-width:44px;min-height:44px;padding:6px 10px;border:0;border-radius:12px;background:rgba(43,38,32,.92);color:#F2EADB;font-size:14px;text-align:left;box-shadow:0 4px 14px rgba(0,0,0,.4)}
#dayBar span{font-size:16px}
#dayBar b{font-weight:700;white-space:nowrap}
#dayBar .dbDot{position:absolute;right:4px;top:4px;width:9px;height:9px;border-radius:50%;background:#E5483A;box-shadow:0 0 0 2px rgba(43,38,32,.92)}
#dayBar.hot{background:#7A5A12}
.dqSec{margin:12px 0 0}
.dqT{font:16px 'Black Han Sans',sans-serif;margin:0 0 6px}
.dqT small{display:block;font:500 13px 'Noto Sans KR',sans-serif;opacity:.75;margin-top:2px}
.dqIt{display:flex;align-items:center;gap:10px;padding:9px 10px;margin:0 0 6px;border-radius:10px;background:rgba(127,127,127,.12)}
.dqIt>div{flex:1;min-width:0}
.dqIt b{display:block;font-size:15px}
.dqIt small{display:block;font-size:13px;opacity:.8;margin-top:2px}
.dqIt.ready{box-shadow:inset 0 0 0 2px var(--gold)}
.dqIt.got{opacity:.6}
.dqIt em{font-style:normal;font-size:13px;color:var(--gold);white-space:nowrap}
.dqGet{flex:0 0 auto;min-width:64px;min-height:44px;padding:0 12px}
.dqBar{display:block;height:6px;margin-top:5px;border-radius:3px;background:rgba(127,127,127,.25);overflow:hidden}
.dqBar i{display:block;height:100%;background:var(--gold)}
.dqCode{font:20px 'Black Han Sans',sans-serif !important;letter-spacing:2px}
.dqFull{font-size:13px;color:#B2291F}
.dqIn{display:block;width:100%;box-sizing:border-box;margin-top:6px;min-height:44px;padding:0 10px;border-radius:8px;border:1.5px solid #8A8274;font:600 16px 'Noto Sans KR',sans-serif;letter-spacing:2px;text-transform:uppercase;background:#fff;color:#1A1418}
.dqNote{font-size:13px;opacity:.8}
/* 10-21 친구 초대 순서 3단계 · 로그인 필요 줄 */
.dqHow{margin:0 0 8px;padding:8px 10px 8px 28px;border-radius:12px;background:rgba(255,255,255,.06);font-size:13.5px;line-height:1.6}
.dqHow li{margin:1px 0}
.dqHow li.ok{opacity:.6}
.dqNeed{border-color:#e8b04a}
/* ★10-23 노선도 최적화 — 예전 evPulse 는 그림자 크기(box-shadow)를 매 장면 바꿔, 막대 밑 지도 그림(요소 5천 개)까지 다시 그렸다
   (CPU 4배 느린 폰 흉내: 가만히 있어도 한 장면 183ms → 이 반짝임만 멈추면 50ms). 빛 테두리를 미리 그려 두고 투명도만 바꾼다(그래픽 칩 몫) */
#evBar.hot::after,#dayBar.hot::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 4px rgba(232,182,76,.45);opacity:0;pointer-events:none;will-change:opacity;animation:evGlow 1.6s infinite}
@keyframes evGlow{50%{opacity:1}}
.evList{display:flex;flex-direction:column;gap:8px;margin:10px 0}
.evIt{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#E8DFD0}
.evIt>i{font-style:normal;font-size:22px}
.evIt>div{flex:1;min-width:0}
.evIt b{display:block;font-size:15px}
.evIt small{display:block;margin-top:2px;font-size:13px;color:#5A5048;word-break:keep-all}
.evIt .evGet{flex:0 0 auto;min-height:44px;padding:0 14px}
.evNote{font-size:13px;color:#7A6F60;word-break:keep-all}

@media (max-width:380px){ #lob header{gap:6px;padding:0 10px} #lob header .pill{padding:0 6px;gap:3px} }   /* 좁은 폰 — 큰 숫자에서 제목이 잘리지 않게(2026-10-13) */

.atNb{margin:4px 0 8px;padding:6px 10px;border-radius:10px;background:#E6F0D8;color:#2F5A1E;font-size:14px;font-weight:700}   /* 신규 손님 7일 출석 2배 (2026-10-13) */
.atNb small{margin-left:6px;font-weight:400;color:#5A7A48}

/* 2회차·큰 판 표시 (2026-10-13 경제 묶음) */
.tag.lap2Tag{background:#2E5BA8;color:#fff}
.tag.tierTag{background:#B8862E;color:#fff}
.stLap2,.stTier{margin:8px 0 0;padding:8px 12px;border-radius:10px;font-size:14px;word-break:keep-all}
.stLap2{background:#E3ECF8;color:#1F3F78}
.stAgain{margin:8px 0 0;padding:8px 12px;border-radius:10px;font-size:14px;line-height:1.45;word-break:keep-all;background:#F4EAD2;color:#6A4A12}   /* 이긴 역 다시 치기 안내(10-20) */
.stTier{background:#F6EBD3;color:#6B4A12}

/* 덱 화면 가진 귀신 — 그림 아래 스킬·부적 두 줄(2026-10-15) */
.dCell{min-width:0;cursor:pointer}
.dInfo{margin-top:3px;font-size:13px;line-height:1.3;color:var(--paper);text-align:center}
.dInfo span{display:block;white-space:normal;overflow-wrap:anywhere}   /* 한 줄 고정이라 「스킬 📜 명부 열…」로 잘렸다(10-18 Macho 「좁은 텍스트 박스 전수 체크」) — 두 줄까지 보이게 */
.dInfo .dCh{color:var(--muted)}
.dInfo .dTg{display:inline-block;margin-right:3px;padding:0 3px;border-radius:4px;background:rgba(127,127,127,.2);font:13px/1.5 sans-serif;font-style:normal;color:var(--muted);vertical-align:1px}   /* 스킬·부적 꼬리표(10-16) — 이름이 같을 때(🌸 점지) 구분 */
.prog .pgL{font-size:13px;color:var(--muted);white-space:nowrap}
.stStake .stK{font-size:14px;color:#E9E0CF}
.secT .dHint{display:block;margin-top:2px;font:13px/1.3 sans-serif;color:var(--muted)}

/* 탭 바꿀 때 화면이 툭 바뀌지 않게 — 내용은 가만히 두고 위에 덮은 바탕만 걷힌다(10-15 화면 전환).
   처음엔 화면 전체를 살짝 키우며 나타나게 했는데, 카드 461장 도감이 층 나누기에 1.9초 걸렸다(실측) → 덮개만 움직인다 */
.view.on:not(#v-map)::after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:var(--bg,#0E0D11);animation:viewCover .26s ease-out forwards}
@keyframes viewCover{from{opacity:1}to{opacity:0;visibility:hidden}}
#v-map.parked{display:block;content-visibility:hidden;pointer-events:none;z-index:-1}   /* 숨긴 동안 지도는 계산도 안 하고(층 나누기 1.9초 → 0) 배치 결과만 보존 */
#v-map.parked #mapFx{display:none}
@keyframes viewIn{from{opacity:0;transform:scale(.982)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .view.on::after{display:none} }

/* ── 상점 「혼불·꾸러미」(2026-10-15 개편) — 묶음 제목 · 꾸러미 큰 카드 · 2칸 격자 · 가로 카드. 그림은 img/shop/*.webp(미드저니) ── */
.spSec{display:flex;align-items:baseline;gap:8px;margin:18px 2px 8px}
.spSec b{font:18px 'Black Han Sans',sans-serif;color:var(--paper);font-weight:400}
.spSec small{font-size:13px;color:var(--muted)}
.spImg{display:block;background:#120f14 center/cover no-repeat}
.spBuy{display:block;width:100%;min-height:44px;margin-top:8px;border:0;border-radius:12px;background:linear-gradient(#3a3640,#2a272f);color:var(--paper);font:16px 'Black Han Sans',sans-serif;box-shadow:0 3px 0 #18161b;opacity:1}
.spBuy small{display:block;font:13px/1.2 sans-serif;color:var(--muted);margin-top:1px}
.spHero{position:relative;overflow:hidden;margin-bottom:10px;border-radius:18px;background:linear-gradient(160deg,#3a1613,#1a1216);box-shadow:inset 0 0 0 1.5px rgba(232,182,76,.55),0 6px 18px rgba(0,0,0,.5)}
.spHero.starter2{background:linear-gradient(160deg,#2b1838,#15121a);box-shadow:inset 0 0 0 1.5px rgba(184,101,240,.55),0 6px 18px rgba(0,0,0,.5)}
.spHero .spImg{height:150px;-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}
.spHeroB{position:relative;margin-top:-34px;padding:0 14px 14px}
.spHeroB>b{display:block;font:22px 'Black Han Sans',sans-serif;color:var(--gold);font-weight:400;text-shadow:0 2px 6px #000}
.spHero.starter2 .spHeroB>b{color:#D8A6FF}
.spGot{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}
.spGot span{display:flex;flex-direction:column;align-items:center;padding:8px 2px;border-radius:12px;background:rgba(255,255,255,.07)}
.spGot em{font-style:normal;font-size:22px;line-height:1}
.spGot span b{font:16px 'Black Han Sans',sans-serif;color:var(--paper);font-weight:400;margin-top:3px}
.spGot span small{font-size:13px;color:var(--muted)}
.spGot .tk b{font-size:14px;color:var(--gold)}
.spRib{position:absolute;z-index:2;top:14px;right:-34px;width:130px;padding:3px 0;transform:rotate(38deg);background:#D3271D;color:#fff;text-align:center;font:13px/1.25 'Black Han Sans',sans-serif;box-shadow:0 2px 6px rgba(0,0,0,.5)}
.spGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.spCard{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;padding:0 8px 10px;border-radius:16px;background:#1B1A20;box-shadow:inset 0 0 0 1.5px #2E2D34}
.spImg.tk{display:grid;place-content:center;justify-items:center;background:radial-gradient(circle at 50% 40%,#5A2A6E,#120f14 75%)}
.spImg.tk b{font-size:44px;line-height:1}.spImg.tk em{font:22px 'Black Han Sans',sans-serif;font-style:normal;color:#F5C542;margin-top:2px}
.spCard .spImg{width:calc(100% + 16px);aspect-ratio:1/1;margin-bottom:6px;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.spCard.best{box-shadow:inset 0 0 0 2px var(--gold),0 0 16px rgba(232,182,76,.25)}
.spAmt{margin-top:-26px;position:relative;font:20px 'Black Han Sans',sans-serif;color:var(--paper);font-weight:400;text-shadow:0 2px 6px #000}
.spName{font-size:13px;color:var(--muted);text-align:center;line-height:1.35}
.spBonus{position:absolute;z-index:2;top:8px;left:8px;padding:2px 8px;border-radius:9px;background:#B865F0;color:#fff;font:13px 'Black Han Sans',sans-serif}
.spBest{position:absolute;z-index:2;top:8px;right:8px;padding:2px 8px;border-radius:9px;background:var(--gold);color:#2a1a08;font:13px 'Black Han Sans',sans-serif}
.spSub{margin:12px 2px 6px;font:15px 'Black Han Sans',sans-serif;color:var(--paper)}
.spSub small{font:13px sans-serif;color:var(--muted);margin-left:6px}
.spEx{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.spExB{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:6px;min-height:56px;padding:8px 2px;border:0;border-radius:14px;background:linear-gradient(#5a2a22,#3a1a16);color:var(--paper);box-shadow:inset 0 0 0 1.5px rgba(211,39,29,.5)}
.spExB span{font-size:13px}
.spExB i{font-style:normal;font-size:14px;color:var(--muted)}   /* ▼ → → 가로 한 줄(10-16) */
.spExB b{font:15px 'Black Han Sans',sans-serif;font-weight:400;color:var(--gold)}
.spExB.no{opacity:.45}
.spWide{display:flex;gap:12px;align-items:stretch;margin-bottom:8px;padding:10px;border-radius:16px;background:#1B1A20;box-shadow:inset 0 0 0 1.5px #2E2D34}
.spWide .spImg{flex:0 0 96px;border-radius:12px}
.spWide>div{flex:1;min-width:0}
.spWide>div>b{font:17px 'Black Han Sans',sans-serif;color:var(--paper);font-weight:400}
.spWide>div>small{display:block;margin-top:3px;font-size:13px;line-height:1.4;color:var(--muted)}
.spTag{margin-left:6px;padding:1px 7px;border-radius:8px;background:rgba(232,182,76,.18);color:var(--gold);font-size:13px;vertical-align:2px}
.spWide.pass{background:linear-gradient(150deg,#1d2a3a,#16151b)}

#regions button.lock{opacity:.6;border-style:dashed}   /* 잠긴 지역(10-16) */

/* 카드 그림 크게 보기(10-16) */
.stArt{flex:0 0 112px;display:flex;flex-direction:column;gap:8px}
.stArt .gc{flex:none;width:112px}
.zoomBtn{min-height:44px;border:0;border-radius:10px;background:#fff;color:#2B2620;font:13px 'Black Han Sans',sans-serif;box-shadow:0 2px 0 #E0D5C2,inset 0 0 0 1.5px #D9CDB8}
#cardZoom{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:56px 16px calc(24px + env(safe-area-inset-bottom));background:rgba(8,7,10,.94);opacity:0;transition:opacity .2s}
#cardZoom.on{opacity:1}
#cardZoom img{max-width:100%;max-height:calc(100% - 70px);object-fit:contain;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.6);transform:scale(.94);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
#cardZoom.on img{transform:none}
#cardZoom .czBar{display:flex;align-items:center;gap:8px;color:#F2EBDD}
#cardZoom .czBar b{font:22px 'Black Han Sans',sans-serif;font-weight:400}
#cardZoom .czBar small{font-size:13px;color:#B9AE9F}
#cardZoom .czX{position:absolute;top:calc(8px + env(safe-area-inset-top));right:8px;width:44px;height:44px;border:0;border-radius:22px;background:rgba(255,255,255,.12);color:#fff;font-size:20px}

/* 상점 혼불·꾸러미 갈래 단추(10-16) */
.spSubs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:4px 0 10px}   /* 10-25 상품 작은 탭 5개(부적 더함) → 3칸 두 줄 */
.spSubs button{min-height:44px;border-radius:12px;border:1.5px solid #DDD3C1;background:#fff;color:#7A7064;font:14px 'Black Han Sans',sans-serif}
.spSubs button.on{background:#B3261B;border-color:#B3261B;color:#fff}

/* 재화 알약 설명 말풍선(10-16) */
.pillTip{position:fixed;z-index:400;max-width:min(300px,calc(100vw - 16px));padding:10px 12px;border-radius:12px;background:#2B2620;color:#F7F1E6;font-size:13px;line-height:1.5;box-shadow:0 8px 24px rgba(0,0,0,.35);animation:tipIn .16s ease-out}
.pillTip b{color:#FFD98A;font-family:'Black Han Sans',sans-serif;font-weight:400;margin-right:4px}
.pillTip::before{content:"";position:absolute;top:-6px;left:calc(var(--ax,50%) - 6px);border:6px solid transparent;border-top:0;border-bottom-color:#2B2620}
@keyframes tipIn{from{opacity:0;transform:translateY(-4px)}}
#lob .pill[role=button]{cursor:pointer}
/* 단추 여백(10-16 Macho 「버튼이 이렇게 붙어있으면 안돼」) — 카드 창 「한 장 더」와 「덱에 넣기」 사이 1px 였다 */
.buyRow{margin-bottom:12px}
.panel .btns{margin-top:12px}
.stArt{gap:10px}
/* 꾸미기 상점(10-16) — 화투 뒷면·판 바닥 미리보기 카드 */
.spSubs.two{grid-template-columns:1fr 1fr}
.skGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
/* 10-28 명패 칭호 고르기 */
.skTtl{margin:0 0 10px;padding:10px;border-radius:10px;background:rgba(232,198,106,.08);border:1px solid rgba(232,198,106,.25)}
.skTtl>b{font:15px 'Black Han Sans',sans-serif;font-weight:400;color:#E8C66A}
.skTtl small{display:block;margin-top:4px;font-size:13px;color:#C9BFAE}
.skTtlL{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.skTtlB{min-height:40px;padding:6px 12px;border-radius:20px;border:1px solid #6B5A3A;background:transparent;color:#E8DCC4;font-size:14px}
.skTtlB.on{background:#E8C66A;color:#2B1A08;border-color:#E8C66A;font-weight:700}
.skGrid.felt{grid-template-columns:1fr 1fr}
.skIt{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 6px;border-radius:14px;background:#fff;box-shadow:0 3px 10px rgba(80,60,30,.12),inset 0 0 0 1px #E8DFCF;text-align:center}
.skIt.on{box-shadow:0 3px 12px rgba(181,123,18,.3),inset 0 0 0 2px #D9A23A}
.skIt b{font:14px 'Black Han Sans',sans-serif;font-weight:400;color:#2B2620;margin-top:4px}
.skIt small{font-size:13px;line-height:1.3;color:#8A8175;min-height:28px}
.skBack{display:block;width:62px;height:99px;border-radius:6px;background:var(--back) center/cover;box-shadow:0 4px 10px rgba(0,0,0,.3),0 0 0 1.5px #fff}
.skFelt{position:relative;display:block;width:100%;aspect-ratio:4/3;border-radius:10px;background:linear-gradient(160deg,#1F3A33,#142621) center/cover;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15),0 3px 8px rgba(0,0,0,.2);overflow:hidden}
.skFelt i{position:absolute;top:28%;width:20%;aspect-ratio:46/74;border-radius:3px;background:#FBF6EC;box-shadow:0 2px 4px rgba(0,0,0,.35)}
.skFelt i:nth-child(1){left:18%;rotate:-6deg;background:#fff linear-gradient(#D3271D 0 40%,#fff 40%)}
.skFelt i:nth-child(2){left:40%;rotate:3deg;background:var(--back)}   /* 크기는 --back 이 정한다(그림 뒷면 = center/cover, 기본 뒷면 = 층마다) — cover 로 덮으면 기본 낙관이 늘어났다(10-20) */
.skFelt i:nth-child(3){left:62%;rotate:8deg;background:#fff linear-gradient(#1C1A20 0 55%,#fff 55%)}
.skBtn{width:100%;min-height:44px;margin-top:6px;border:0;border-radius:10px;font:14px 'Black Han Sans',sans-serif;background:#fff;color:#2B2620;box-shadow:0 2px 0 #E0D5C2,inset 0 0 0 1.5px #D9CDB8}
.skBtn.buy{background:#2B2620;color:#fff;box-shadow:0 2px 0 #000}
.skBtn.buy.no{opacity:.45}
.skBtn.use{background:#fff;color:#B3261B;box-shadow:0 2px 0 #E0D5C2,inset 0 0 0 1.5px #B3261B}
.skBtn.on{background:#F1EADC;color:#8A8175;box-shadow:none}
/* 꾸미기 — 얻는 길 꼬리표·받기·잠금 단추(10-16 「역 깨기·배지·혼불·노잣돈 다양하게」) */
.skIt{position:relative}
.skWay{position:absolute;top:6px;left:6px;z-index:2;padding:1px 6px;border-radius:8px;font:13px 'Black Han Sans',sans-serif;font-style:normal;color:#fff;background:#6B6258}
.skWay.clr{background:#2E6FB8}.skWay.bdg{background:#B57B12}.skWay.hon{background:#C2410C}.skWay.gld{background:#7A6A3A}
.skBtn.get{background:#B3261B;color:#fff;box-shadow:0 2px 0 #7E1A13}
.skBtn.lock{background:#F1EADC;color:#8A8175;box-shadow:inset 0 0 0 1px #E3D9C6;font:13px/1.25 sans-serif;padding:2px 4px}
.skBtn.lock span{display:block;white-space:normal;overflow-wrap:anywhere}   /* 열림 조건이 「🕯 원한 10명 풀…」로 잘려 무엇을 해야 열리는지 못 읽었다(10-18) */
/* 꾸미기 칸이 글자 길이에 끌려 넓어져 오른쪽 칸이 화면 밖으로 잘렸다(10-16 실측) — 칸 너비를 내용과 떼어 놓는다 */
.skGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
.skGrid.felt{grid-template-columns:repeat(2,minmax(0,1fr))}
.skIt{min-width:0}
.skIt b,.skIt small{max-width:100%;overflow-wrap:anywhere}

/* 결제 확인 창(2026-10-17) — 구성 목록 · 청약철회 안내 */
.spGive{margin:6px 0 10px;padding:0 0 0 4px;list-style:none;font-size:16px;line-height:1.7}
.spGive li::before{content:'· ';opacity:.6}
.spLaw{font-size:13px;line-height:1.55;opacity:.8;margin:0 0 4px}

/* 10-21 보상 결과 창 — 지금 화면 위에 받은 것만(지도를 다시 그리지 않는다) */
#rwPop{position:fixed;inset:0;z-index:220;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(5,5,8,.55);animation:fade .18s}
#rwPop .rpBox{width:100%;max-width:300px;padding:20px 18px 16px;border-radius:18px;background:#F2EBDD;color:#141317;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.45);animation:rpIn .22s ease-out}
#rwPop .rpT{font:18px 'Black Han Sans',sans-serif;margin-bottom:10px}
#rwPop .rpL{font:500 16px/1.7 'Noto Sans KR',sans-serif}
#rwPop .rpL b{font-size:20px;color:#B8322A}
#rwPop .rpOk{width:100%;height:48px;min-height:48px;margin-top:14px}
@keyframes rpIn{from{transform:scale(.9);opacity:0}}

/* 10-23 노선도 — 카드를 받은 역에만 작은 금색 카드 */
#map .cardB rect{fill:#E8B64C;stroke:#fff;stroke-width:1.6}
#map .cardB rect.in{fill:none;stroke:rgba(110,70,10,.75);stroke-width:1}
#map .cardB{pointer-events:none}   /* 그림자 효과 없음 — 지도 확대 속도(10-13 구슬 그림자도 뺐다) */
/* 지상 나들이(10-23) — 이긴 역 창의 명소 3곳. 단추는 한 줄 64px(사진 56) · 누르면 그 명소에서 한 판 */
.stGround{margin:10px 0 0;padding:10px;border-radius:12px;background:#EFE6D2;color:#3B2C14}
.stGround .grH{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 2px 8px;font:16px 'Black Han Sans',sans-serif}
.stGround .grN{font:14px 'Noto Sans KR',sans-serif;color:#7A5B22}
.stGround .grN b{font-size:16px;color:#B5651D}
.grL{display:flex;flex-direction:column;gap:6px}
.grS{display:flex;align-items:center;gap:6px;width:100%;min-height:64px;padding:4px 8px 4px 4px;border:1.5px solid #D9C8A2;border-radius:12px;background:#FFFBF1;color:#2A2016}
.grInfo{flex:1;min-width:0;display:flex;align-items:center;gap:10px;min-height:56px;padding:0;border:0;background:none;color:inherit;text-align:left;font:inherit;cursor:pointer}   /* 10-23 사진·이름 = 자세히(팝업) */
.grInfo:active,.grGo:active{transform:scale(.97)}
.grMore{display:block;margin-top:1px;font-style:normal;font-size:12px;color:#B5651D}
.grS.ok{background:#F3F0E6;border-color:#C9D8B8}
.grImg{position:relative;flex:0 0 56px;width:56px;height:56px;border-radius:9px;overflow:hidden;background:#CDBB94}
.grImg img{width:100%;height:100%;object-fit:cover;display:block}
.grOk{position:absolute;right:-2px;bottom:-2px;width:24px;height:24px;border-radius:50%;background:#2E7D32;color:#fff;font:700 14px/24px sans-serif;font-style:normal;text-align:center;box-shadow:0 0 0 2px #fff}
.grT{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.grT b{font:15px/1.25 'Black Han Sans',sans-serif;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:keep-all}
.grT small{font-size:12.5px;color:#7A6A4E}
.grGo{flex:0 0 auto;min-width:60px;min-height:44px;padding:0 12px;border:0;border-radius:22px;background:#D3271D;color:#fff;font:15px 'Black Han Sans',sans-serif;text-align:center;cursor:pointer}
.grS.ok .grGo{background:#8A7E68}
.grP{margin:8px 2px 0;font-size:13px;line-height:1.55;color:#6A4A12;word-break:keep-all}
/* 밸런스 v3(10-25) — 판 스킬 없는 카드 안내 · 강화 단추 */
.skNone{margin:10px 0 4px;padding:8px 10px;border-radius:10px;background:rgba(43,38,32,.06);font-size:13.5px;line-height:1.5}
.enhRow .btn.dim{opacity:.55}
/* 카드 각성(10-25 하수구) — 금테 */
.gc.awk{box-shadow:0 0 0 3px #F5C542,0 0 14px rgba(245,197,66,.65)}
.awkDone{margin:10px 0 4px;padding:8px 10px;border-radius:10px;background:linear-gradient(90deg,rgba(245,197,66,.25),rgba(245,197,66,.08));font-size:14px;font-weight:700}
/* 노잣돈 꾸미기 미리보기(10-25) — 「승!」 띠 · 내려치기 조각 · 명패 */
.spSubs.five{grid-template-columns:repeat(3,1fr)}
.spSubs.seven{grid-template-columns:repeat(4,1fr)}   /* 꾸미기 7칸 — 4칸 두 줄 */
.spSubs.seven button{font-size:13px;padding:0 2px;line-height:1.15}
.skPv{display:grid;place-items:center;height:64px;border-radius:10px;background:#1F3A33;margin-bottom:6px;overflow:hidden}
.skPv.win i{font:22px 'Black Han Sans',sans-serif;font-style:normal;padding:4px 18px;border-radius:4px;color:#2B2620;background:linear-gradient(90deg,#B07A1C,#E8B64C,#B07A1C)}
.skPv.win.w-fire i{background:linear-gradient(90deg,#7A1508,#FF6A1A,#7A1508);color:#fff}
.skPv.win.w-petal i{background:linear-gradient(90deg,#B85C80,#F7A8C4,#B85C80)}
.skPv.win.w-bolt i{background:linear-gradient(90deg,#0E2A5A,#3A8DFF,#0E2A5A);color:#fff;box-shadow:0 0 12px rgba(127,211,255,.8)}
.skPv.win.w-goldleaf i{background:linear-gradient(90deg,#7A520E,#F5C542,#FFF1C8,#F5C542,#7A520E);box-shadow:0 0 14px rgba(245,197,66,.9)}
.skPv.hit{grid-template-columns:repeat(4,12px);gap:6px;place-content:center}
.skPv.hit i{width:12px;height:12px;transform:rotate(45deg);background:#E8B64C}
.skPv.hit.h-fire i{background:#FF6A1A}.skPv.hit.h-petal i{background:#F7A8C4;border-radius:50% 0}.skPv.hit.h-ink i{background:#141317;box-shadow:0 0 0 2px #D3271D}.skPv.hit.h-gold i{background:#F5C542;box-shadow:0 0 8px #FFF1C8}
.skPv.plate i{font:15px 'Black Han Sans',sans-serif;font-style:normal;color:#C9BFAE;padding:2px 10px;border-radius:7px}
.skPv.plate.p-wood i{background:linear-gradient(#A0703C,#7A4E24);color:#FFF4DE}
.skPv.plate.p-silver i{background:linear-gradient(#F2F4F7,#A9AFB8);color:#2B2620}
.skPv.plate.p-gold i{background:linear-gradient(#FBE29A,#C9962C);color:#2B1A08}
.skPv.plate.p-jade i{background:linear-gradient(#A6E3C8,#3E9A7A);color:#0E2E22}
.skPv.plate.p-bronze i{background:linear-gradient(#C08A55,#7C5531 60%,#4F8A78);color:#FFF1DC}
.skPv.plate.p-ebony i{background:linear-gradient(#3A302A,#141110);color:#F5C542;box-shadow:inset 0 0 0 1px #8C6A2A}
.skPv.plate.p-ruby i{background:linear-gradient(#F58A8A,#A8121E);color:#FFF1F1}
.skPv.plate.p-rainbow i{background:linear-gradient(90deg,#FF7A7A,#FFC85A,#FFF07A,#7AE08C,#6FB8FF,#B48CFF);color:#1A1420}
.skPv.win.w-inkburst i{background:radial-gradient(circle at 25% 50%,#D3271D 0 12%,transparent 13%),#141317;color:#fff;box-shadow:0 0 0 2px #D3271D}
.skPv.win.w-obang i{background:linear-gradient(90deg,#1F4E9C 0 20%,#C8102E 20% 40%,#F2C230 40% 60%,#FFFFFF 60% 80%,#141317 80%);color:#fff;-webkit-text-stroke:1px #141317}
.skPv.win.w-star i{background:radial-gradient(circle at 20% 35%,#fff 0 4%,transparent 5%),radial-gradient(circle at 80% 70%,#FFF6B0 0 4%,transparent 5%),linear-gradient(90deg,#0B1338,#2A3C8C,#0B1338);color:#fff;box-shadow:0 0 12px rgba(127,168,255,.8)}
.skPv.win.w-dancheong i{background:repeating-linear-gradient(90deg,#1E7B4F 0 8px,#C8102E 8px 13px,#F2C230 13px 16px,#1F4E9C 16px 24px);color:#fff;-webkit-text-stroke:1px #141317;box-shadow:0 0 0 2px #F2C230}
.skPv.win.w-dragon i{background:linear-gradient(90deg,#5A0E08,#E5483A,#F5C542,#FFF1C8,#F5C542,#E5483A,#5A0E08);color:#FFE9A8;-webkit-text-stroke:1px #141317;box-shadow:0 0 16px rgba(245,197,66,.9)}
.skPv.go.w-base i{background:#B3261B;color:#fff}
.skPv.hit.h-star i{background:#CFE8FF;box-shadow:0 0 8px #7FA8FF}.skPv.hit.h-obang i:nth-child(1){background:#C8102E}.skPv.hit.h-obang i:nth-child(2){background:#1F4E9C}.skPv.hit.h-obang i:nth-child(3){background:#F2C230}.skPv.hit.h-obang i:nth-child(4){background:#fff}
.skPv.hit.h-snow i{background:#fff;border-radius:2px;box-shadow:0 0 6px #A9D8F5}.skPv.hit.h-bolt i{background:#7FD3FF;box-shadow:0 0 8px #3A8DFF}
.skPv.hand{grid-auto-flow:column;gap:4px;place-content:center;padding:0 6px}
.skPv.hand i{width:13px;height:20px;border-radius:2px;background:#F4EEE2}
.skPv.hand i.m{margin-top:-6px;box-shadow:0 0 0 2px #E8B64C}
.skPv.hand.d-gold i{box-shadow:0 0 0 1.5px #F5C542,0 0 6px rgba(255,205,100,.6)}.skPv.hand.d-gold i.m{box-shadow:0 0 0 2.5px #F5C542,0 0 12px rgba(255,205,100,.8)}
.skPv.hand.d-jade i{box-shadow:0 0 0 1.5px #5FD3A8,0 0 6px rgba(95,211,168,.6)}.skPv.hand.d-jade i.m{box-shadow:0 0 0 2.5px #5FD3A8,0 0 12px rgba(95,211,168,.8)}
.skPv.hand.d-fire i{box-shadow:0 0 0 1.5px #FF6A1A,0 0 6px rgba(255,106,26,.6)}.skPv.hand.d-fire i.m{box-shadow:0 0 0 2.5px #FF6A1A,0 0 12px rgba(255,106,26,.8)}
.skPv.hand.d-moon i{box-shadow:0 0 0 1.5px #DCE6FF,0 0 6px rgba(200,215,255,.7)}.skPv.hand.d-moon i.m{box-shadow:0 0 0 2.5px #DCE6FF,0 0 12px rgba(200,215,255,.9)}
.skPv.hand.d-rainbow i:nth-child(1){box-shadow:0 0 0 1.5px #FF6B6B,0 0 6px #FF6B6B}.skPv.hand.d-rainbow i:nth-child(2){box-shadow:0 0 0 1.5px #FFB547,0 0 6px #FFB547}.skPv.hand.d-rainbow i:nth-child(3){box-shadow:0 0 0 2.5px #FFE45C,0 0 12px #FFE45C}.skPv.hand.d-rainbow i:nth-child(4){box-shadow:0 0 0 1.5px #6EDB8A,0 0 6px #6EDB8A}.skPv.hand.d-rainbow i:nth-child(5){box-shadow:0 0 0 1.5px #62B4FF,0 0 6px #62B4FF}
/* ── 윤회 바퀴(무료 룰렛, 10-27) — 노선도 단추는 📋 바로 아래 ── */
#whBar{position:absolute;right:12px;top:100px;z-index:3;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:rgba(43,38,32,.92);color:#F2EADB;box-shadow:0 4px 14px rgba(0,0,0,.4)}
#whBar span{font-size:22px;line-height:1}
#whBar .dbDot{position:absolute;right:4px;top:4px;width:9px;height:9px;border-radius:50%;background:#E5483A;box-shadow:0 0 0 2px rgba(43,38,32,.92)}
#whBar.hot{background:#7A5A12}
.whLine{text-align:center;margin:-2px 0 8px;color:#7A6A55;font-size:14px}
.whWrap{position:relative;width:min(280px,76vw);aspect-ratio:1;margin:4px auto 12px}
.whSvg{display:block;width:100%;height:100%;will-change:transform}
.whTx{fill:#F7EBCF;font:700 15px 'Noto Sans KR',sans-serif}
.whHub{fill:#E8C36A;font-size:24px}
.whPin{position:absolute;left:50%;top:-6px;z-index:2;width:0;height:0;margin-left:-13px;border-left:13px solid transparent;border-right:13px solid transparent;border-top:24px solid #D3271D;filter:drop-shadow(0 2px 2px rgba(0,0,0,.45))}
.whBtns .whGo{width:100%;min-height:52px}
.whOdds{margin-top:12px;padding:10px 12px;border-radius:12px;background:rgba(43,38,32,.06);display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;font-size:13px;color:#5A4E40}
.whOdds b{grid-column:1/-1;font-size:13px;color:#2B2620}
.whOdds span{display:flex;justify-content:space-between;gap:6px}
.whOdds em{font-style:normal;font-weight:700;color:#2B2620}
.whOdds small{grid-column:1/-1;color:#8A7C6A;font-size:12px;margin-top:2px}