/* 경제: 쿠폰 · 내 상가 레벨 · 레벨업 연출 (public/js/pages/me.js, ui/store-card.js, ui/levelup.js) */
.wallet { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px; }
.wallet .amt { font: 400 26px/1 var(--f-sign); color: var(--sign-yellow); }
.wallet .amt small { font-size: 14px; color: var(--muted); }
.wallet .sub { font-size: 12px; color: var(--muted); margin-top: 4px; }
.tip { display: flex; gap: 8px; align-items: flex-start; margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: rgba(245, 184, 0, .12); font-size: 13px; color: var(--paper); }

.my-shop { display: grid; gap: 10px; padding: 12px; }
.my-shop .top { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: center; }
.my-shop .pic { width: 96px; aspect-ratio: 6 / 5; border-radius: 8px; background: #1B2233; object-fit: cover; }
.my-shop .nm { display: inline-flex; align-items: center; min-height: var(--tap); font: 400 18px/1.2 var(--f-sign); color: var(--paper); }
.my-shop .sub { font-size: 12px; color: var(--muted); }
.lv-badge { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; padding: 2px 8px; border-radius: 999px; background: var(--sign-yellow); color: var(--ink); font: 400 13px/1.4 var(--f-sign); }
.lv-look { font-size: 12px; color: var(--muted); margin-left: 6px; }

.prog { display: grid; gap: 4px; }
.prog .row { display: flex; justify-content: space-between; font-size: 13px; color: var(--paper); }
.prog .row b { color: var(--sign-yellow); }
.prog .bar { height: 10px; border-radius: 999px; background: var(--night-3); overflow: hidden; border: 1px solid var(--line-2); }
.prog .bar i { display: block; height: 100%; background: linear-gradient(90deg, #F5B800, #FFD84D); border-radius: inherit; transition: width .5s ease; }
.prog .next { font-size: 12px; color: var(--muted); }
.stats { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--muted); }
.stats b { color: var(--paper); }
.lv-go { animation: lvPulse 1.2s ease-in-out infinite; }
@keyframes lvPulse { 50% { transform: scale(1.03); box-shadow: 0 0 0 6px rgba(245, 184, 0, .25); } }

.deco { display: grid; gap: 6px; }
.deco .field-label { font-size: 12px; color: var(--muted); }
.swatches { display: flex; gap: 8px; flex-wrap: wrap; }
.swatch { width: var(--tap); height: var(--tap); border-radius: 8px; border: 2px solid var(--line-2); cursor: pointer; }
.swatch[aria-pressed="true"] { border-color: var(--sign-yellow); box-shadow: 0 0 0 3px rgba(245, 184, 0, .35); }
.font-chip { font-size: 16px; }
.locked-note { font-size: 12px; color: var(--muted); }

.spend-box { display: grid; gap: 6px; }
.spend-box .muted b { color: var(--ink); }

/* 레벨업 연출 */
.lvup { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 16px; background: rgba(8, 12, 24, .72); opacity: 0; transition: opacity .25s ease; }
.lvup.go { opacity: 1; }
.lvup-card { width: min(360px, 100%); display: grid; gap: 12px; padding: 18px; border-radius: 16px; background: var(--night-2, #141B2D); border: 2px solid var(--sign-yellow); box-shadow: 0 0 40px rgba(245, 184, 0, .35); transform: scale(.8); transition: transform .45s cubic-bezier(.2, 1.6, .4, 1); }
.lvup.go .lvup-card { transform: scale(1); }
.lvup-no { font: 400 54px/1 var(--f-sign); color: var(--sign-yellow); text-align: center; text-shadow: 0 0 18px rgba(245, 184, 0, .7); }
.lvup-pics { position: relative; aspect-ratio: 6 / 5; border-radius: 10px; overflow: hidden; background: #1B2233; }
.lvup-pics img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lvup-after { opacity: 0; transition: opacity .6s ease .7s; }
.lvup.go .lvup-after { opacity: 1; }
.lvup.still .lvup-after { transition: none; }
.lvup-say .kicker { font-size: 14px; color: var(--ink); }
.lvup-unlock { padding: 10px 12px; border-radius: 10px; background: rgba(245, 184, 0, .14); color: var(--paper); font-size: 14px; text-align: center; }
.lvup-unlock b { color: var(--sign-yellow); }
@media (prefers-reduced-motion: reduce) { .lvup, .lvup-card, .lvup-after, .prog .bar i { transition: none; } .lv-go { animation: none; } }
