/* 둥근 폰트 (Nunito + Noto Sans KR) */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700&family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

/* 다크 웜 그레이 톤 (덜 갈색, 글씨 가독성 우선) */
:root{
  --bg0:#2a2622;
  --bg1:#36322c;
  --panel0:rgba(52,48,42,.94);
  --panel1:rgba(60,55,48,.96);
  --line:rgba(180,170,150,.22);
  --line2:rgba(220,200,120,.28);
  --text:#f2ede3;
  --muted:rgba(230,222,208,.88);
  --muted2:rgba(210,202,188,.78);
  --mint:#00a896;
  --cyan:#0091ea;
  --purple:#9d7bff;
  --pink:#e91e8c;
  --danger:#e53935;
  --kakao:#d4a808;
  --kakao-bright:#FEE500;
  --kakao-dark:#2a2622;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: "Nunito", "Noto Sans KR", ui-sans-serif, system-ui, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  color:var(--text);
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background:
    radial-gradient(900px 500px at 20% 15%, rgba(180,160,100,.08), transparent 55%),
    radial-gradient(800px 420px at 85% 20%, rgba(160,140,90,.06), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 50%, #322e28);
}
a{color:inherit;text-decoration:none}

/* 기존 페이지(상점/운영자/관리자) 레이아웃 유지 + 톤만 업 */
.wrap{max-width:980px;margin:0 auto;padding:28px}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}
.brand{font-weight:800;letter-spacing:.2px}
.card{
  background:linear-gradient(180deg, var(--panel1), var(--panel0));
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  box-shadow:0 14px 40px rgba(0,0,0,.38);
}
.grid{display:grid;grid-template-columns:1.2fr .8fr;gap:14px}
@media(max-width:900px){.grid{grid-template-columns:1fr}}
.muted{color:var(--muted);font-size:13px;line-height:1.45}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
input,select,button,textarea{
  border-radius:12px;
  border:1px solid rgba(180,170,150,.28);
  background:rgba(48,44,38,.9);
  color:var(--text);
  padding:10px 12px;
  outline:none;
}
input:focus,textarea:focus{border-color:var(--kakao);box-shadow:0 0 0 2px rgba(212,168,8,.25)}
button{
  cursor:pointer;
  border-color:rgba(180,160,100,.35);
  background:linear-gradient(180deg, rgba(62,56,48,.95), rgba(52,46,40,.95));
  color:var(--text);
}
button.primary{background:linear-gradient(180deg, var(--kakao), #b8920e);border-color:#9a7a0a;color:var(--kakao-dark);font-weight:800}
button.danger{background:rgba(229,57,53,.2);border-color:var(--danger);color:#ffabab}
.pill{
  display:inline-flex;gap:8px;align-items:center;
  border:1px solid rgba(180,170,150,.22);
  padding:6px 10px;border-radius:999px;
  background:rgba(52,48,42,.85);
  color:var(--text);
}
.list{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.item{
  display:flex;justify-content:space-between;gap:10px;align-items:flex-start;
  padding:12px;border-radius:14px;border:1px solid rgba(180,170,150,.18);
  background:rgba(48,44,40,.75);
}

/* 운영자 제품 리스트 hover: 살짝 볼록(떠오름) */
#productList .item{
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
  will-change: transform;
}
#productList .item:hover{
  transform: translateY(-2px) scale(1.01);
  border-color: rgba(212,168,8,.35);
  box-shadow: 0 18px 55px rgba(0,0,0,.35);
}
.item h4{margin:0 0 4px 0;font-size:15px;color:var(--text)}
.item .meta{font-size:12px;color:var(--muted2)}
.hr{height:1px;background:rgba(180,165,120,.15);margin:12px 0}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.ok{color:#74c69d}.bad{color:var(--danger)}
.right{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.footer{margin-top:14px;color:var(--muted2);font-size:12px}

/* 홈 전용 */
.shell{min-height:100%;display:flex;flex-direction:column}
.nav{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;
  background:rgba(42,38,34,.94);
  backdrop-filter: blur(10px);
  border-bottom:1px solid rgba(180,170,150,.2);
}
.iconBtn{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:38px;border-radius:12px;
  border:1px solid rgba(180,170,150,.28);
  background:rgba(52,48,42,.85);
  color:var(--text);
  cursor:pointer;
}
.navHome{font-weight:800;letter-spacing:.6px;color:var(--text)}
.navRight{display:flex;gap:10px;align-items:center}

.container{max-width:1040px;margin:0 auto;padding:18px 16px 34px}

.toast{
  display:flex;gap:14px;align-items:flex-start;
  padding:14px 14px;
  border-radius:16px;
  border:1px solid rgba(212,168,8,.4);
  background:linear-gradient(90deg, rgba(56,52,44,.95), rgba(50,46,42,.92) 55%, rgba(62,56,50,.88));
  box-shadow:0 14px 40px rgba(0,0,0,.35);
}
.toastIcon{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--kakao);border:1px solid #9a7a0a;color:var(--kakao-dark)}
.toastBody{flex:1}
.toastTitle{font-weight:800;margin-top:2px;color:var(--text)}
.toastDesc{margin-top:6px;color:var(--muted);line-height:1.35;font-size:13px}
.toastClose{margin-left:auto;background:transparent;border:none;color:var(--muted2);font-size:16px;cursor:pointer;padding:8px}

.heroCardLink{
  display:block;
  text-decoration:none;
  color:inherit;
  cursor:pointer;
}
.heroCard{
  margin-top:14px;
  border-radius:22px;
  border:1px solid rgba(180,170,150,.22);
  background:linear-gradient(180deg, rgba(56,52,46,.95), rgba(50,46,42,.92));
  box-shadow:0 18px 60px rgba(0,0,0,.35);
  overflow:hidden;
  display:grid;
  grid-template-columns:1.25fr .75fr;
  min-height:320px;
}
@media(max-width:920px){.heroCard{grid-template-columns:1fr}}
.heroText{padding:22px 22px 18px}
.heroTitle{font-size:34px;line-height:1.1;font-weight:900;letter-spacing:-.2px;color:var(--text)}
.grad{background:linear-gradient(90deg, #d4a808, #e8c030, #c9a227);-webkit-background-clip:text;background-clip:text;color:transparent}
.gradA{filter:saturate(1.15)}
.gradB{filter:saturate(1.2)}
.heroSub{margin-top:12px;color:var(--muted);font-size:13.5px;line-height:1.45}
.heroBtns{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:14px;border:1px solid rgba(180,170,150,.28);background:rgba(52,48,42,.88);font-weight:700;color:var(--text)}
.btn.primary{border-color:#9a7a0a;background:linear-gradient(180deg, var(--kakao), #b8920e);color:var(--kakao-dark);font-weight:800}
.btn.ghost{background:transparent;border-color:rgba(180,165,120,.25);color:var(--muted)}
.heroMini{margin-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:700px){.heroMini{grid-template-columns:1fr}}
.miniCol{background:rgba(52,48,42,.9);border:1px solid rgba(180,170,150,.2);border-radius:16px;padding:12px}
.miniHead{font-weight:800;margin-bottom:8px;color:var(--text)}
.check{margin:0;padding-left:18px;color:var(--muted);font-size:12.8px;line-height:1.5}
.steps{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:12.8px}
.stepDot{display:inline-flex;width:18px;height:18px;border-radius:999px;align-items:center;justify-content:center;background:rgba(212,168,8,.3);border:1px solid rgba(180,150,50,.45);margin-right:8px;font-weight:800;color:var(--kakao-dark);font-size:12px}

.heroArt{position:relative;padding:18px;display:flex;align-items:center;justify-content:center}
.orb{position:absolute;border-radius:999px;filter:blur(.2px);opacity:.95}
.orb1{width:210px;height:210px;background:radial-gradient(circle at 35% 30%, rgba(212,168,8,.5), rgba(180,140,40,.15) 55%, transparent 72%);transform:translate(20px,-10px)}
.orb2{width:170px;height:170px;background:radial-gradient(circle at 35% 30%, rgba(160,130,40,.4), rgba(140,110,30,.1) 55%, transparent 72%);transform:translate(-30px,45px)}
.orb3{width:120px;height:120px;background:radial-gradient(circle at 35% 30%, rgba(200,170,60,.35), rgba(212,168,8,.08) 60%, transparent 75%);transform:translate(55px,65px)}

.stack{margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:920px){.stack{grid-template-columns:1fr}}
.cardXL{
  border-radius:20px;
  border:1px solid rgba(180,170,150,.2);
  background:linear-gradient(180deg, rgba(56,52,46,.94), rgba(48,44,40,.92));
  box-shadow:0 16px 50px rgba(0,0,0,.28);
  padding:16px;
}
.cardHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.cardTitle{font-weight:900;letter-spacing:.2px;color:var(--text)}
.cardActions{display:flex;gap:10px;align-items:center}
.linkBtn{color:var(--muted);font-size:12px}
.linkBtn:hover{color:var(--text)}

.rankList{display:flex;flex-direction:column;gap:10px}
.rankRow{display:grid;grid-template-columns:26px 54px 1fr auto;gap:10px;align-items:center;padding:10px 10px;border-radius:16px;border:1px solid rgba(180,170,150,.2);background:rgba(52,48,42,.82)}
.rankNum{font-weight:900;color:var(--kakao)}
.rankThumb{width:54px;height:34px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg, rgba(212,168,8,.35), rgba(180,140,40,.4));border:1px solid rgba(180,165,120,.2);color:var(--text)}
.rankName{color:var(--text);font-weight:700}
.rankMeta{color:var(--muted2);font-size:12px}

.reviewList{display:flex;flex-direction:column;gap:10px}
.reviewRow{padding:10px 10px;border-radius:16px;border:1px solid rgba(180,170,150,.2);background:rgba(52,48,42,.82)}
.reviewProduct{color:var(--text);font-weight:700}
.reviewUser{margin-top:6px;color:var(--muted);font-size:12px}
.reviewContent{margin-top:8px;padding-top:8px;border-top:1px solid rgba(180,170,150,.18);color:var(--muted);font-size:13px;line-height:1.5;white-space:pre-wrap}
.mono2{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.tier{padding:2px 8px;border-radius:999px;border:1px solid rgba(180,170,150,.28);background:rgba(54,50,44,.92);color:var(--text)}
.tier.VIP{color:#5dd;border-color:rgba(0,168,150,.4)}
.tier.VVIP{color:#b79cff;border-color:rgba(157,123,255,.4)}
.tier.구매자{color:var(--muted)}

.qnaList{display:flex;flex-direction:column;gap:10px}
.qnaRow{display:flex;gap:10px;align-items:center;padding:10px 10px;border-radius:16px;border:1px solid rgba(180,170,150,.2);background:rgba(52,48,42,.82)}
.qnaQ{width:28px;height:28px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--kakao);border:1px solid #9a7a0a;color:var(--kakao-dark);font-weight:900}
.qnaText{color:var(--muted);font-size:13px}

.liveLogWrap{height:280px;overflow:hidden;position:relative}
.liveLogTrack{display:flex;flex-direction:column;animation:liveLogScroll 40s linear infinite}
.liveLogTrack .liveList{flex:0 0 auto}
@keyframes liveLogScroll{0%{transform:translateY(0)}100%{transform:translateY(-50%)}}
.liveList{display:flex;flex-direction:column;gap:10px}
.liveRow{display:grid;grid-template-columns:74px 1fr 52px;gap:10px;align-items:center;padding:10px 10px;border-radius:16px;border:1px solid rgba(180,170,150,.2);background:rgba(52,48,42,.82)}
.liveUser{color:var(--text);font-weight:600}
.liveMsg{color:var(--muted);font-size:12.5px}
.liveTime{color:var(--muted2);font-size:12px;text-align:right}

.cardXL.fullSpan{grid-column:1 / -1}

.muted2{color:var(--muted2);font-size:12.5px;line-height:1.5}
.footer2{margin-top:18px;text-align:center}

/* 홈 공지사항 리스트 */
.noticeList{display:flex;flex-direction:column;gap:10px}
.noticeRow{display:flex;gap:12px;align-items:center;padding:10px 10px;border-radius:16px;border:1px solid rgba(180,170,150,.2);background:rgba(52,48,42,.82)}
.noticeThumb{width:44px;height:44px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:var(--kakao);border:1px solid #9a7a0a;color:var(--kakao-dark);font-size:18px}
.noticeMain{flex:1}
.noticeTitleText{color:var(--text);font-weight:800;font-size:13.5px;line-height:1.25}
.noticeMeta{color:var(--muted2);font-size:12px;margin-top:6px}
.noticeContent{margin-top:8px;color:var(--muted);font-size:13px;line-height:1.5;white-space:pre-wrap}

.fab{
  position:fixed;right:18px;bottom:18px;
  width:46px;height:46px;border-radius:999px;
  border:1px solid rgba(180,165,120,.3);
  background:linear-gradient(180deg, var(--kakao), #b8920e);
  box-shadow:0 14px 40px rgba(0,0,0,.35);
  color:var(--kakao-dark);
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
}

/* PC 상점 레이아웃(사이드바 + 메인) */
.appLayout{
  min-height:100vh;
  display:flex;
}
.sideBar{
  width:270px;
  padding:16px 14px;
  background:linear-gradient(180deg, rgba(54,50,44,.98), rgba(48,44,40,.96));
  border-right:1px solid rgba(180,170,150,.2);
  position:sticky;
  top:0;
  height:100vh;
  overflow:auto;
}
.sideTop{margin-bottom:14px}
.logoWrap{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px;
  border-radius:18px;
  border:1px solid rgba(180,170,150,.22);
  background:rgba(52,48,42,.88);
}
.logoOrb{
  width:46px;height:46px;border-radius:999px;
  background:radial-gradient(circle at 30% 30%, var(--kakao), rgba(160,130,40,.6) 45%, rgba(50,42,22,.4) 70%);
  border:1px solid rgba(180,150,50,.4);
  box-shadow:0 12px 30px rgba(0,0,0,.4);
}
.logoText{
  font-weight:900;
  letter-spacing:.3px;
  color:var(--text);
}
.sideCard{
  padding:12px;
  border-radius:18px;
  border:1px solid rgba(180,165,120,.18);
  background:linear-gradient(180deg, rgba(48,42,30,.95), rgba(40,35,25,.9));
  margin-top:12px;
}
.sideCardTitle{
  font-weight:900;
  margin-bottom:6px;
  color:var(--text);
}
.sideHint{
  color:var(--muted);
  font-size:12.5px;
  line-height:1.45;
}
.sideFields{margin-top:10px}
.sideInput{
  width:100%;
  margin-top:8px;
}
.sideBtnRow{display:flex;gap:10px}
.sideBtnRow button{flex:1}
.btnMeAction{
  display:block;
  text-align:center;
  padding:10px 14px;
  border-radius:12px;
  font-weight:700;
  font-size:13px;
  text-decoration:none;
  color:var(--text);
  border:1px solid rgba(180,165,120,.25);
  background:rgba(50,46,42,.92);
  transition:border-color .15s, background .15s;
}
.btnMeAction:hover{ border-color:rgba(212,168,8,.4); background:rgba(50,44,28,.95) }
.btnMeAction.primary{
  background:linear-gradient(180deg, var(--kakao), #b8920e);
  border-color:#9a7a0a;
  color:var(--kakao-dark);
}
.btnMeAction.primary:hover{ filter:brightness(1.08) }
.hr2{height:1px;background:rgba(180,165,120,.18);margin:12px 0}
.sideStatRow{
  display:flex;gap:12px;justify-content:space-between;align-items:center;
  padding:6px 0;
}
.sideStatLabel{color:var(--muted);font-size:12px}
.sideStatValue{color:var(--text);font-size:13px}
.mono2{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}
.sidePre{
  margin-top:10px;
  min-height:56px;
  white-space:pre-wrap;
  color:var(--muted);
  font-size:12px;
}
/* 사이드바 큰카테고리 메뉴 + 호버 시 작은카테고리 드롭다운 */
.sideCategoryWrap{ margin-top:14px }
.sideCategoryMenu{ display:flex; flex-direction:column; gap:8px }
.sideCategoryBtn{
  display:block;
  width:100%;
  text-align:center;
  padding:10px 14px;
  border-radius:12px;
  font-weight:700;
  font-size:13px;
  text-decoration:none;
  color:var(--text);
  border:1px solid rgba(180,165,120,.25);
  background:rgba(50,46,42,.92);
  transition:border-color .15s, background .15s;
}
.sideCategoryBtn:hover{ border-color:rgba(212,168,8,.4); background:rgba(50,44,28,.95) }
.sideCategoryBtn.primary{
  background:linear-gradient(180deg, var(--kakao), #b8920e);
  border-color:#9a7a0a;
  color:var(--kakao-dark);
}
.sideCategoryBtn.primary:hover{ filter:brightness(1.08) }

.sideCategoryItemWrap{ position:relative }
.sideCategoryDropdown{
  overflow:hidden;
  max-height:0;
  margin-top:0;
  padding:0 0 0 0;
  border-radius:0 0 12px 12px;
  border:1px solid transparent;
  border-top:none;
  background:rgba(48,44,38,.97);
  transition:max-height .25s ease, margin-top .2s ease, padding .2s ease, border-color .2s ease;
}
.sideCategoryItemWrap:hover .sideCategoryDropdown{
  max-height:280px;
  margin-top:4px;
  padding:6px 0 8px 0;
  border-color:rgba(180,170,150,.28);
  border-top:1px solid rgba(180,170,150,.2);
}
.sideCategoryDropdown a{
  display:block;
  padding:6px 14px 6px 18px;
  font-size:13px;
  color:var(--muted);
  transition:background .15s ease, color .15s ease;
}
.sideCategoryDropdown a:hover{
  background:rgba(212,168,8,.12);
  color:var(--text);
}
.sideCategoryDropdownEmpty{
  padding:10px 14px 10px 18px;
  font-size:12px;
  color:var(--muted2);
}

.sideMenu{margin-top:14px}
.sideMenuTitle{color:var(--muted);font-weight:800;margin:10px 0 8px 4px;font-size:12px}
.sideMenuItem{
  display:block;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(180,165,120,.18);
  background:rgba(52,48,42,.78);
  margin-top:8px;
  color:var(--text);
  font-weight:700;
}
.sideMenuItem:hover{
  border-color:var(--kakao);
  background:rgba(212,168,8,.15);
}
.sideBottomNote{
  margin-top:14px;
  color:var(--muted2);
  font-size:12px;
}

.main{
  flex:1;
  padding:18px 18px 36px 18px;
}
.mainHeader{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(180,170,150,.22);
  background:rgba(54,50,44,.9);
}
.mainTitle{font-weight:900;letter-spacing:.2px;color:var(--text)}
.mainHeaderRight{display:flex;gap:10px;align-items:center}
.miniBtn{
  padding:8px 12px;
  border-radius:14px;
  border:1px solid rgba(180,170,150,.28);
  background:rgba(52,48,42,.88);
  color:var(--text);
  font-weight:800;
  cursor:pointer;
}

.noticeBar{
  margin-top:14px;
  border-radius:18px;
  border:1px solid rgba(212,168,8,.38);
  background:linear-gradient(90deg, rgba(58,54,48,.95), rgba(52,48,44,.92) 55%, rgba(62,56,50,.9));
  padding:14px 14px;
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.noticeIcon{
  width:44px;height:44px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:var(--kakao);
  border:1px solid #9a7a0a;
  color:var(--kakao-dark);
}
.noticeBody{flex:1}
.noticeTitle{font-weight:900;color:var(--text)}
.noticeDesc{
  margin-top:6px;
  color:var(--muted);
  line-height:1.45;
  font-size:13px;
}
.noticeClose{
  background:transparent;
  border:none;
  color:var(--muted2);
  font-size:16px;
  cursor:pointer;
  padding:6px 8px;
}

.section{margin-top:18px}
.sectionHead{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:12px;
  margin-bottom:12px;
}
.sectionTitle{font-weight:900;font-size:16px}
.sectionMeta{color:var(--muted);font-size:12.8px}

/* 상점 카테고리 메뉴 + 호버 시 작은카테고리 드롭다운 */
#categoryMenu{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:flex-start;
}
.categoryMenuWrap{
  position:relative;
  display:inline-block;
}
.categoryMenuWrap .pill,
.categoryMenuWrap .primary{
  margin:0;
}
.categoryDropdown{
  position:absolute;
  top:100%;
  left:0;
  margin-top:4px;
  min-width:160px;
  padding:8px 0;
  border-radius:12px;
  border:1px solid rgba(180,170,150,.28);
  background:rgba(48,44,38,.97);
  box-shadow:0 12px 32px rgba(0,0,0,.4);
  z-index:30;
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.categoryMenuWrap:hover .categoryDropdown{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.categoryDropdown a{
  display:block;
  padding:8px 14px;
  font-size:13px;
  color:var(--muted);
  transition:background .15s ease, color .15s ease;
}
.categoryDropdown a:hover{
  background:rgba(212,168,8,.12);
  color:var(--text);
}
.categoryDropdownEmpty{
  padding:10px 14px;
  font-size:12px;
  color:var(--muted2);
}

.productGrid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
}
@media(max-width:1200px){.productGrid{grid-template-columns:repeat(3, minmax(0,1fr))}}
@media(max-width:980px){.productGrid{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media(max-width:760px){
  .appLayout{display:block}
  .sideBar{position:relative;height:auto;width:auto}
  .main{padding:14px 12px}
  .productGrid{grid-template-columns:repeat(1, minmax(0,1fr))}
}

.productCard{
  border-radius:18px;
  border:1px solid rgba(180,165,120,.18);
  background:linear-gradient(180deg, rgba(56,52,46,.95), rgba(50,46,42,.92));
  box-shadow:0 16px 46px rgba(0,0,0,.3);
  overflow:hidden;
  min-height:280px;
  display:flex;
  flex-direction:column;
}
.productBanner{
  height:160px;
  padding:12px 12px 0 12px;
  position:relative;
  background:linear-gradient(180deg, rgba(48,44,38,.95), rgba(42,38,32,.9));
  display:flex;
  align-items:center;
  justify-content:center;
}
.productBannerImg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center center;
  opacity:.9;
  z-index:0;
  filter:saturate(1.1) contrast(1.02);
}
.productBannerTitle{
  font-weight:1000;
  letter-spacing:.8px;
  text-shadow:0 2px 8px rgba(0,0,0,.4);
  color:var(--text);
  font-size:15px;
  position:relative;
  z-index:2;
}
.productBody{
  padding:12px 14px 14px 14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.productName{
  font-weight:900;
  color:var(--text);
  letter-spacing:.2px;
  min-height:36px;
}
.productMeta{
  color:var(--muted);
  font-size:12.5px;
}
.productActions{
  margin-top:auto;
  display:flex;
  gap:10px;
  align-items:center;
}
.qtySelect{
  flex:1;
  padding:10px 10px;
  border-radius:14px;
  border:1px solid rgba(180,165,120,.25);
  background:rgba(50,46,42,.92);
  color:var(--text);
  font-weight:800;
}
.btnBuy{
  width:86px;
  padding:10px 10px;
  border-radius:14px;
  border:1px solid #9a7a0a;
  background:linear-gradient(180deg, var(--kakao), #b8920e);
  color:var(--kakao-dark);
  font-weight:900;
}

.detailHero{
  display:flex;
  gap:16px;
  align-items:flex-start;
}
.detailImageWrap{
  position:relative;
  width:220px;
  height:160px;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(180,165,120,.18);
  background:rgba(50,46,42,.75);
}
.detailInfo{
  flex:1;
  min-width:0;
}
.landingRich p{margin:0 0 10px 0}
.landingRich ul{margin:0 0 10px 18px}
.landingRich ol{margin:0 0 10px 18px}

.landingLabel{display:block;color:var(--muted);font-size:12.5px;font-weight:700}
.landingInput{width:100%}

.txPre{
  min-height:120px;
  white-space:pre-wrap;
  color:var(--muted);
  border-radius:18px;
  padding:14px;
  border:1px solid rgba(180,165,120,.18);
  background:rgba(52,48,42,.88);
}