/* 장터(market.js) — DESIGN.md: 장면 한 장 + 먹색 깔림 + 줄 목록, 직각·2px 먹선, 금색 버튼은 화면에 하나 */
#tab-market{padding-bottom:16px}
#tab-market .mk-head{position:relative;margin:-14px -12px 0;min-height:168px;display:flex;align-items:flex-end;background:#120d1c url('art/scene-market.webp') center 55%/cover}
#tab-market .mk-head::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,5,14,0) 20%,rgba(8,5,14,.88));pointer-events:none}
#tab-market .mk-head-t{position:relative;padding:0 16px 12px;max-width:640px}
#tab-market .mk-title{font-size:26px;color:#f2c14e;text-shadow:2px 2px 0 #000;line-height:1.1}
#tab-market .mk-head p{margin:6px 0 0;font-size:12px;line-height:1.5;color:#bdb0d6;text-shadow:1px 1px 0 #000}
#tab-market .mk-tabs{display:flex;gap:0;margin:0 -12px 12px;background:#0f0b18;box-shadow:0 2px 0 #07050b}
#tab-market .mk-tabs button{flex:1;min-height:44px;background:none;border:0;color:#a597c6;font:inherit;font-size:13px;cursor:pointer;border-bottom:3px solid transparent}
#tab-market .mk-tabs button[aria-selected="true"]{color:#f1ebff;border-bottom-color:#7a52c4;background:#1e1730}
#tab-market .mk-tabs i{font-style:normal;color:#f2c14e}
#tab-market .mk-filter{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px}
#tab-market .mk-filter .input-field{width:auto;min-width:0;flex:1 1 110px;margin:0;min-height:36px;font-size:12px}
#tab-market .mk-chip{min-height:36px;padding:0 12px;background:#2a2140;color:#bdb0d6;border:0;font:inherit;font-size:12px;cursor:pointer;
  box-shadow:0 0 0 2px #07050b,inset 2px 2px 0 #4b3b6e,inset -2px -2px 0 #0f0b18}
#tab-market .mk-chip[aria-pressed="true"]{background:#7a52c4;color:#fff}
#tab-market .mk-slots{margin-left:auto}
#tab-market .mk-list{list-style:none;margin:0;padding:0}
#tab-market .mk-row{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid rgba(165,151,198,.16);cursor:pointer;min-height:64px}
#tab-market .mk-row:hover,#tab-market .mk-row:focus-visible{background:rgba(122,82,196,.12);outline:none}
#tab-market .mk-row.off{cursor:default;opacity:.5}
#tab-market .mk-row.off:hover{background:none}
.mk-art{display:inline-flex;align-items:center;justify-content:center;flex:none;background:#0f0b18;box-shadow:0 0 0 2px #07050b,inset 2px 2px 0 #2a2140}
.mk-art img{max-width:88%;max-height:88%;width:auto!important;height:auto!important;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 3px 0 rgba(0,0,0,.45))}
#tab-market .mk-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
#tab-market .mk-mid b,.mk-sheet-top b{font-weight:400;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tab-market .mk-mid em,.mk-sheet-top em{font-style:normal;font-size:11px;color:#a597c6}
#tab-market .mk-mid small,.mk-sheet-top small{font-size:11px;color:#bdb0d6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#tab-market .mk-price{display:flex;flex-direction:column;align-items:flex-end;gap:1px;flex:none;text-align:right}
#tab-market .mk-price b{font-weight:400;font-size:16px;color:#f2c14e;text-shadow:1px 1px 0 #000}
#tab-market .mk-price small{font-size:11px;color:#bdb0d6}
#tab-market .mk-price .btn{width:auto;min-height:36px;padding:0 12px;font-size:12px}
.mk-dim{color:#a597c6!important;font-size:11px}
.mk-gold{color:#f2c14e;font-weight:400}
#tab-market .mk-empty{text-align:center;color:#a597c6;font-size:12px;line-height:1.8;padding:28px 0}
#tab-market .mk-note{margin:0 0 10px;padding:10px 12px;background:#2a2140;color:#f1ebff;font-size:12px;box-shadow:0 0 0 2px #07050b}
#tab-market .mk-foot{margin-top:12px;line-height:1.6}
#tab-market .mk-more{display:block;margin:12px auto 0;width:auto;padding:0 24px}
#tab-market .mk-box{padding:12px 14px;background:#1e1730;box-shadow:0 0 0 2px #07050b,inset 2px 2px 0 #4b3b6e,inset -2px -2px 0 #0f0b18;margin-bottom:14px}
#tab-market .mk-box h4,#tab-market .mk-h{margin:0 0 8px;font-weight:400;font-size:16px;color:#f2c14e;text-shadow:2px 2px 0 #07050b}
#tab-market .mk-h{margin-top:16px;font-size:13px}
#tab-market .mk-box p{margin:0 0 10px;font-size:13px;line-height:1.6}
#tab-market .mk-hist{list-style:none;margin:0;padding:0;font-size:12px}
#tab-market .mk-hist li{display:flex;gap:8px;align-items:baseline;padding:7px 2px;border-bottom:1px solid rgba(165,151,198,.12)}
#tab-market .mk-hist span{flex:none;font-size:11px;color:#a597c6}
#tab-market .mk-hist span.sell{color:#f2c14e}
#tab-market .mk-hist em{margin-left:auto;font-style:normal;color:#bdb0d6;white-space:nowrap}
#tab-market .mk-hist small{flex:none;color:#a597c6;font-size:11px}
/* 사고팔기 창 */
.mk-veil{position:fixed;inset:0;z-index:9000;background:rgba(8,5,14,.72);display:flex;align-items:flex-end;justify-content:center}
.mk-sheet{width:100%;max-width:520px;max-height:88vh;overflow:auto;background:#1e1730;padding:16px;
  box-shadow:0 0 0 2px #07050b,0 0 0 4px #7a52c4,0 0 0 6px #07050b;animation:mkUp .22s steps(4,end)}
@keyframes mkUp{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@media (min-width:700px){.mk-veil{align-items:center}}
.mk-sheet-top{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.mk-sheet-top>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.mk-sheet p{font-size:12px;line-height:1.6;margin:0 0 8px}
.mk-cmp span.up{color:#7ee08a}.mk-cmp span.down{color:#ff7a7a}
.mk-sum{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin:12px 0;padding:10px 12px;background:#0f0b18;font-size:12px;color:#bdb0d6}
.mk-sum b{font-weight:400;color:#f1ebff;text-align:right}
.mk-field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#bdb0d6;margin-bottom:10px}
.mk-field .input-field{margin:0;min-height:40px;font-size:14px}
.mk-act{display:flex;gap:8px}
.mk-act .btn{flex:1 1 0;width:auto!important;height:auto!important;min-height:44px;margin:0!important}
.mk-act .btn:first-child{flex:0 0 auto;padding:0 18px}
.mk-ghost{position:fixed;z-index:9500;pointer-events:none;transform-origin:center}
.mk-fxhost{position:fixed;inset:0;z-index:9600;pointer-events:none}
@media (min-width:900px){
  #tab-market .mk-list{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}
  #tab-market .mk-head{min-height:200px}
}
@media (prefers-reduced-motion:reduce){.mk-sheet{animation:none}}