/* ══════════════════════════════════════════
   리셀그라운드 v4 — 데이터 + 거래 + 수익 플랫폼
   색상: Slate Dark + Muted Green (3% 모티프)
   폰트: Noto Sans KR
══════════════════════════════════════════ */
:root {
  /* 배경 계층 */
  --bg:       #f4f6f9;
  --bg-white: #ffffff;
  --bg-soft:  #f9fafb;
  --bg-card:  #ffffff;

  /* 텍스트 */
  --text:     #111827;
  --text-sub: #4b5563;
  --text-mute:#9ca3af;

  /* 브랜드 — Slate Navy */
  --brand:    #1e3a5f;
  --brand-d:  #152b47;
  --brand-l:  #e8eef8;

  /* 3% 시그니처 — Muted Green (과하지 않은) */
  --three:    #059669;
  --three-d:  #047857;
  --three-l:  #ecfdf5;

  /* 보조 포인트 */
  --amber:    #d97706;  /* HOT / 상승 */
  --red:      #dc2626;  /* 하락 / 위험 */
  --blue:     #2563eb;  /* 정보 */

  /* 기능색 */
  --success:  #059669;
  --danger:   #dc2626;
  --warn:     #d97706;

  /* 테두리 */
  --border:   #e5e7eb;
  --border-d: #d1d5db;

  /* 그림자 */
  --shadow-sm: 0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
  --shadow:    0 4px 6px rgba(0,0,0,.06),0 2px 4px rgba(0,0,0,.04);
  --shadow-lg: 0 10px 15px rgba(0,0,0,.08),0 4px 6px rgba(0,0,0,.04);

  /* 폰트 */
  --f: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, sans-serif;

  /* 간격 */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;
  --s6:24px;--s8:32px;--s10:40px;--s12:48px;--s16:64px;

  /* 레이아웃 */
  --nav-h: 96px;
  --max-w: 1280px;
  --radius:   8px;
  --radius-lg:12px;

  /* Z-index */
  --z-nav:200;--z-drawer:300;--z-modal:400;--z-toast:500;

  /* 전환 */
  --fast:.15s ease;--base:.25s ease;--slow:.4s ease;
}

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:14px}
body{
  background:var(--bg);color:var(--text);
  font-family:var(--f);line-height:1.6;
  overflow-x:hidden;word-break:keep-all;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font-family:var(--f)}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--three);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ── UTILITIES ── */
.container{max-width:var(--max-w);margin:0 auto;padding:0 var(--s5)}
.section-tag{
  display:inline-flex;align-items:center;gap:var(--s2);
  font-size:11px;font-weight:700;color:var(--three);
  margin-bottom:var(--s2);letter-spacing:.8px;
}
.section-tag::before{content:'';width:3px;height:13px;background:var(--three);border-radius:2px;flex-shrink:0}
.section-h{font-size:22px;font-weight:800;color:var(--text);margin-bottom:var(--s5);line-height:1.3}
.text-three{color:var(--three)}
.text-brand{color:var(--brand)}
.text-amber{color:var(--amber)}
.text-mute-ol{-webkit-text-stroke:1.5px var(--text-sub);color:transparent}
.reveal{opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.reveal.on{opacity:1;transform:translateY(0)}
.empty-state{text-align:center;padding:var(--s12) var(--s8);grid-column:1/-1}
.empty-state__icon{font-size:36px;margin-bottom:var(--s3);opacity:.35}
.empty-state__title{font-size:15px;font-weight:700;color:var(--text-sub);margin-bottom:var(--s1)}
.empty-state__desc{font-size:12px;color:var(--text-mute)}

/* 뱃지 */
.badge{display:inline-block;font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;letter-spacing:.3px;vertical-align:middle}
.badge-hot{background:#fef2f2;color:var(--red);border:1px solid #fecaca}
.badge-new{background:var(--three-l);color:var(--three);border:1px solid #a7f3d0}
.badge-rare{background:#f5f3ff;color:#7c3aed;border:1px solid #ddd6fe}
.badge-verified{background:var(--brand-l);color:var(--brand);border:1px solid #bfdbfe}
.badge-live{background:var(--red);color:#fff;animation:livePulse 1.8s infinite}
@keyframes livePulse{0%,100%{opacity:1}50%{opacity:.7}}

/* ── BUTTONS ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  gap:var(--s1);font-family:var(--f);font-size:13px;font-weight:700;
  padding:9px 18px;border:none;cursor:pointer;
  transition:all var(--fast);min-height:40px;border-radius:var(--radius);
}
/* 3% 모티프 — 주요 CTA는 muted green */
.btn--p{background:var(--three);color:#fff}
.btn--p:hover{background:var(--three-d);transform:translateY(-1px);box-shadow:0 4px 12px rgba(5,150,105,.3)}
/* 브랜드 버튼 */
.btn--brand{background:var(--brand);color:#fff}
.btn--brand:hover{background:var(--brand-d);transform:translateY(-1px)}
/* 아웃라인 */
.btn--g{background:#fff;color:var(--text-sub);border:1px solid var(--border-d)}
.btn--g:hover{border-color:var(--three);color:var(--three);background:var(--three-l)}
.btn--outline-three{background:transparent;color:var(--three);border:1.5px solid var(--three)}
.btn--outline-three:hover{background:var(--three);color:#fff}
.btn--outline-brand{background:transparent;color:var(--brand);border:1.5px solid var(--brand)}
.btn--outline-brand:hover{background:var(--brand);color:#fff}
/* 사이즈 */
.btn--sm{min-height:30px;padding:5px 12px;font-size:12px}
.btn--lg{min-height:46px;padding:11px 24px;font-size:14px}
.btn--full{width:100%}
.btn--load{opacity:.7;pointer-events:none;position:relative}
.btn--load::after{
  content:'';display:inline-block;width:13px;height:13px;margin-left:var(--s2);
  border:2px solid currentColor;border-top-color:transparent;
  border-radius:50%;animation:spin .6s linear infinite;vertical-align:middle;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* 아이콘 버튼 */
.icon-btn{
  width:38px;height:38px;border-radius:var(--radius);
  border:1px solid var(--border);background:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:all var(--fast);
  position:relative;color:var(--text-sub);flex-shrink:0;
}
.icon-btn:hover{border-color:var(--three);color:var(--three);background:var(--three-l)}
.icon-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon-btn__dot{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%;border:2px solid #fff}
.dot--three{background:var(--three)}
.dot--red{background:var(--red)}

/* ── FORMS ── */
.form-group{margin-bottom:var(--s4)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.form-label{display:block;font-size:12px;font-weight:700;color:var(--text-sub);margin-bottom:5px}
.form-input,.form-select,.form-textarea{
  width:100%;background:#fff;border:1px solid var(--border-d);
  color:var(--text);font-family:var(--f);font-size:13px;
  padding:9px 12px;outline:none;border-radius:var(--radius);
  transition:border-color var(--fast),box-shadow var(--fast);min-height:40px;
}
.form-input:focus,.form-select:focus,.form-textarea:focus{
  border-color:var(--three);box-shadow:0 0 0 3px rgba(5,150,105,.12);
}
.form-input::placeholder,.form-textarea::placeholder{color:var(--text-mute)}
.form-input.err{border-color:var(--danger);box-shadow:0 0 0 3px rgba(220,38,38,.1)}
.form-input.ok{border-color:var(--success)}
.form-error{font-size:11px;color:var(--danger);margin-top:4px;display:none}
.form-error.show{display:block}
.form-hint{font-size:11px;color:var(--text-mute);margin-top:4px}
.form-char{font-size:11px;color:var(--text-mute);text-align:right;margin-top:4px}
.form-textarea{resize:vertical;min-height:88px}
.form-select option{background:#fff}
.form-check{display:flex;align-items:flex-start;gap:var(--s2);margin-bottom:var(--s3)}
.form-check input[type="checkbox"]{margin-top:3px;accent-color:var(--three);flex-shrink:0;width:15px;height:15px}
.form-check label{font-size:13px;color:var(--text-sub);line-height:1.5;cursor:pointer}
.form-divider{display:flex;align-items:center;gap:var(--s3);margin:var(--s4) 0}
.form-divider::before,.form-divider::after{content:'';flex:1;height:1px;background:var(--border)}
.form-divider span{font-size:12px;color:var(--text-mute)}
.form-price-display{font-size:18px;font-weight:800;color:var(--three);margin-top:5px;min-height:24px}
.required{color:var(--danger);font-weight:700}
.optional{color:var(--text-mute);font-size:11px;font-weight:400}

/* ── AVATARS ── */
.av-a{background:linear-gradient(135deg,#059669,#0891b2)}
.av-b{background:linear-gradient(135deg,#dc2626,#d97706)}
.av-c{background:linear-gradient(135deg,#7c3aed,#2563eb)}
.av-d{background:linear-gradient(135deg,#0891b2,#059669)}
.av-e{background:linear-gradient(135deg,#dc2626,#7c3aed)}

/* ── TAG SELECT ── */
.tag-select{display:flex;flex-wrap:wrap;gap:var(--s2)}
.tag-opt{
  padding:5px 12px;font-size:12px;font-weight:600;
  border:1.5px solid var(--border-d);color:var(--text-sub);
  cursor:pointer;transition:all var(--fast);border-radius:20px;background:#fff;
}
.tag-opt:hover{border-color:var(--three);color:var(--three)}
.tag-opt.sel{background:var(--three);border-color:var(--three);color:#fff}

/* ── PASSWORD ── */
.input-pw-wrap{position:relative;display:flex;align-items:center}
.input-pw-wrap .form-input{padding-right:44px}
.pw-toggle{position:absolute;right:2px;width:40px;height:calc(100% - 4px);background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-mute);transition:color var(--fast);border-radius:6px}
.pw-toggle:hover{color:var(--three)}
.pw-toggle svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pw-strength-wrap{display:flex;align-items:center;gap:var(--s2);margin-top:5px}
.pw-strength-track{flex:1;height:4px;background:var(--border);border-radius:2px;overflow:hidden}
.pw-strength-bar{height:100%;width:0;border-radius:2px;transition:width .3s,background .3s}
.pw-strength-bar.weak{background:var(--danger)}
.pw-strength-bar.medium{background:var(--warn)}
.pw-strength-bar.strong{background:var(--success)}
.pw-strength-label{font-size:11px;min-width:24px;text-align:right;font-weight:700}
.pw-strength-label.weak{color:var(--danger)}
.pw-strength-label.medium{color:var(--warn)}
.pw-strength-label.strong{color:var(--success)}

/* ── UPLOAD ── */
.upload-area{border:2px dashed var(--border-d);padding:var(--s6);text-align:center;cursor:pointer;transition:all var(--fast);background:var(--bg-soft);border-radius:var(--radius)}
.upload-area:hover,.upload-area.drag-over{border-color:var(--three);background:var(--three-l)}
.upload-area__icon{font-size:28px;margin-bottom:var(--s2)}
.upload-area__text{font-size:13px;color:var(--text-sub);margin-bottom:4px;font-weight:500}
.upload-area__hint{font-size:11px;color:var(--text-mute)}
.upload-count{color:var(--three);font-weight:700}
.upload-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:var(--s2);margin-top:var(--s3)}
.upload-preview-item{position:relative;background:var(--bg-soft);border:1px solid var(--border);border-radius:6px;overflow:hidden}
.upload-preview-item img{width:100%;height:68px;object-fit:cover}
.upload-preview-info{padding:3px var(--s2);display:flex;align-items:center;gap:3px}
.upload-preview-name{font-size:9px;color:var(--text-sub);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upload-preview-size{font-size:9px;color:var(--text-mute);flex-shrink:0}
.upload-preview-del{flex-shrink:0;width:16px;height:16px;background:var(--danger);border:none;color:#fff;font-size:9px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%}


/* ═══ 리셀그라운드 추가 스타일 ═══ */

/* 셀러 등급 배지 */
.tier-badge{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;letter-spacing:.3px;margin-right:3px}
.tier-badge.verified{background:linear-gradient(135deg,var(--three),#0891b2);color:#fff;box-shadow:0 2px 6px rgba(5,150,105,.3)}
.tier-badge.trusted{background:linear-gradient(135deg,var(--amber),#f59e0b);color:#fff;box-shadow:0 2px 6px rgba(217,119,6,.25)}
.tier-badge.normal{background:var(--border);color:var(--text-sub)}
.tier-badge.weekly{background:linear-gradient(135deg,#7c3aed,#2563eb);color:#fff;animation:weeklyGlow 2s infinite}
@keyframes weeklyGlow{0%,100%{box-shadow:0 2px 6px rgba(124,58,237,.3)}50%{box-shadow:0 2px 12px rgba(124,58,237,.6)}}
.badge-weekly{font-size:10px;font-weight:700;color:#7c3aed;background:#f5f3ff;padding:1px 6px;border-radius:10px;border:1px solid #ddd6fe}

/* 상품/드롭 태그 */
.drop-tag{position:absolute;bottom:var(--s2);right:var(--s2);z-index:3;font-size:10px;font-weight:700;padding:3px 8px;border-radius:4px}
.drop-tag.sold{background:rgba(0,0,0,.7);color:#fff}
.drop-tag.reserved{background:rgba(217,119,6,.9);color:#fff}
.drop-tag.collab{background:rgba(124,58,237,.9);color:#fff}
.drop-tag.fast{background:rgba(5,150,105,.9);color:#fff}
.drop-tag.cert{background:rgba(30,58,95,.9);color:#fff}

/* 판매완료 카드 dim */
.dc--sold .dc__img-inner{opacity:.45;filter:grayscale(60%)}
.dc--sold .dc__price{text-decoration:line-through;color:var(--text-mute)}
.pop__sold-overlay{position:absolute;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;color:#fff;letter-spacing:1px}

/* 게시글 태그 */
.pc__tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:var(--s2)}
.post-tag{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;letter-spacing:.3px}
.tag-collab{background:#f5f3ff;color:#7c3aed;border:1px solid #ddd6fe}
.tag-cert{background:var(--three-l);color:var(--three);border:1px solid #a7f3d0}
.tag-fast{background:#fff7ed;color:var(--amber);border:1px solid #fed7aa}
.tag-sold{background:var(--border);color:var(--text-mute)}
.tag-info{background:var(--brand-l);color:var(--brand);border:1px solid #bfdbfe}
.tag-review{background:#fef9c3;color:#854d0e;border:1px solid #fde047}

/* 게시글 작성자 신뢰 */
.post-author-verified{color:var(--three);font-weight:800}
.post-author-trusted{color:var(--amber);font-weight:800}
.pc__tier-icon{font-size:9px;margin-left:3px;font-weight:900}
.pc__action-btn{margin-left:auto;font-size:11px;font-weight:600;color:var(--text-mute);background:none;border:1px solid var(--border);padding:2px 8px;border-radius:10px;cursor:pointer;transition:all var(--fast)}
.pc__action-btn:hover{border-color:var(--three);color:var(--three)}

/* 실시간 거래 로그 */
.trade-log-section{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm)}
.trade-log-header{display:flex;align-items:center;justify-content:space-between;padding:var(--s3) var(--s4);background:var(--bg-soft);border-bottom:2px solid var(--three)}
.trade-log-header h3{font-size:13px;font-weight:800;color:var(--text)}
.trade-log-list{max-height:320px;overflow-y:auto}
.trade-log-item{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:var(--s2);padding:10px var(--s4);border-bottom:1px solid var(--border);transition:background var(--fast);cursor:pointer}
.trade-log-item:last-child{border-bottom:none}
.trade-log-item:hover{background:var(--three-l)}
.trade-log-em{font-size:18px;text-align:center}
.trade-log-info{display:flex;flex-direction:column;gap:2px}
.trade-log-item-name{font-size:12px;font-weight:600;color:var(--text)}
.trade-log-price{font-size:11px;color:var(--text-mute)}
.trade-log-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.trade-log-action{font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px}
.action-done{background:var(--three-l);color:var(--three)}
.action-new{background:var(--brand-l);color:var(--brand)}
.action-change{background:#fff7ed;color:var(--amber)}
.trade-log-change{font-size:11px;font-weight:800}
.trade-log-change.up{color:var(--three)}
.trade-log-change.dn{color:var(--red)}
.trade-log-time{font-size:10px;color:var(--text-mute)}

/* 피드 신뢰 배지 */
.feed-trust-badge{font-size:9px;font-weight:700;padding:1px 5px;border-radius:3px;margin-left:4px}
.feed-trust-verified{background:var(--three-l);color:var(--three)}
.feed-trust-trusted{background:#fff7ed;color:var(--amber)}

/* 셀러 신뢰 시스템 */
.sc__tier-row{margin-bottom:var(--s2);display:flex;flex-wrap:wrap;gap:4px}
.sc__trust-row{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:var(--s2) 0;border-top:1px dashed var(--border);margin-top:var(--s2)}
.sc__trust-item{text-align:center}
.sc__trust-label{display:block;font-size:9px;color:var(--text-mute);margin-bottom:2px}
.sc__trust-val{font-size:11px;font-weight:700;color:var(--text)}
.sc__temp-row{display:flex;align-items:center;gap:var(--s2);padding:var(--s2) 0;margin-top:4px}
.sc__temp-label{font-size:10px;color:var(--text-mute)}
.sc__temp-bar{flex:1;height:4px;background:var(--border);border-radius:2px;overflow:hidden}
.sc__temp-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#22c55e);border-radius:2px;transition:width .6s ease}

/* 채팅 거래 강화 */
.chat-msg-read{font-size:9px;color:rgba(255,255,255,.6);margin-left:6px;display:block;text-align:right;margin-top:2px}
.chat-msg.them .chat-msg-read{color:var(--text-mute)}
.chat-trade-card{margin:var(--s2) 0;background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;cursor:pointer;transition:all var(--fast)}
.chat-trade-card:hover{border-color:var(--three)}
.chat-trade-card__inner{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4)}
.chat-trade-card__em{font-size:28px}
.chat-trade-card__name{font-size:13px;font-weight:700;color:var(--text)}
.chat-trade-card__price{font-size:12px;color:var(--three);font-weight:700}
.chat-trade-card__status{margin-left:auto;font-size:10px;font-weight:700;color:var(--amber);background:#fff7ed;padding:3px 8px;border-radius:4px}
.chat-tools{display:flex;gap:var(--s2);padding:var(--s2) var(--s4);border-top:1px solid var(--border);background:var(--bg-soft)}
.chat-tool-btn{font-size:11px;font-weight:600;color:var(--text-sub);background:#fff;border:1px solid var(--border);padding:4px 10px;border-radius:6px;cursor:pointer;transition:all var(--fast)}
.chat-tool-btn:hover{border-color:var(--three);color:var(--three)}

/* 모바일 하단 네비게이션 */
.bottom-nav{
  display:none;position:fixed;bottom:0;left:0;right:0;z-index:var(--z-nav);
  background:#fff;border-top:1px solid var(--border);
  box-shadow:0 -4px 16px rgba(0,0,0,.08);
  grid-template-columns:repeat(5,1fr);
  height:58px;align-items:stretch;
}
.bottom-nav__item{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;cursor:pointer;transition:all var(--fast);
  border:none;background:none;padding:0;color:var(--text-mute);font-family:var(--f);
}
.bottom-nav__item:hover,.bottom-nav__item.act{color:var(--three)}
.bottom-nav__icon{font-size:20px;line-height:1}
.bottom-nav__label{font-size:10px;font-weight:600}
.bottom-nav__item.act .bottom-nav__icon{filter:none}

/* FAB 버튼 (모바일 플로팅) */
.fab-btn{
  display:none;position:fixed;bottom:72px;right:var(--s4);z-index:var(--z-nav);
  width:52px;height:52px;border-radius:50%;
  background:var(--three);color:#fff;border:none;
  font-size:24px;cursor:pointer;
  box-shadow:0 4px 16px rgba(5,150,105,.4);
  transition:all var(--fast);align-items:center;justify-content:center;
}
.fab-btn:hover{background:var(--three-d);transform:scale(1.08)}

/* 알림 모달 */
.notif-item{display:flex;align-items:flex-start;gap:var(--s3);padding:var(--s3) var(--s4);border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--fast)}
.notif-item:hover{background:var(--bg-soft)}
.notif-item--unread{background:var(--three-l)}
.notif-icon{font-size:22px;flex-shrink:0}
.notif-msg{font-size:13px;color:var(--text);font-weight:500;margin-bottom:3px}
.notif-time{font-size:11px;color:var(--text-mute)}
.notif-dot{width:8px;height:8px;border-radius:50%;background:var(--three);flex-shrink:0;margin-top:5px}

/* 스폰서/추천 셀러 슬롯 */
.sponsor-banner{
  background:linear-gradient(135deg,#1e3a5f 0%,#1d4ed8 100%);
  border-radius:var(--radius-lg);padding:var(--s4) var(--s5);
  display:flex;align-items:center;gap:var(--s4);
  color:#fff;margin-bottom:var(--s5);position:relative;overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.sponsor-banner::before{content:'SPONSORED';position:absolute;top:var(--s2);right:var(--s3);font-size:9px;font-weight:700;color:rgba(255,255,255,.5);letter-spacing:1px}
.sponsor-banner::after{content:'';position:absolute;right:-20px;top:-20px;width:100px;height:100px;background:rgba(255,255,255,.06);border-radius:50%}
.sponsor-banner__avatar{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;border:2px solid rgba(255,255,255,.3)}
.sponsor-banner__name{font-size:16px;font-weight:900;margin-bottom:3px}
.sponsor-banner__desc{font-size:12px;color:rgba(255,255,255,.75)}
.sponsor-banner__badge{display:inline-block;background:rgba(255,255,255,.2);font-size:9px;font-weight:700;padding:2px 7px;border-radius:3px;margin-top:4px;letter-spacing:.5px}
.sponsor-banner__btn{margin-left:auto;background:#fff;color:var(--brand);font-size:12px;font-weight:800;padding:8px 18px;border-radius:var(--radius);border:none;cursor:pointer;flex-shrink:0;white-space:nowrap;transition:all var(--fast);font-family:var(--f)}
.sponsor-banner__btn:hover{transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,.2)}

/* 섹션 헤더 */
.sec-hd{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:var(--s5);gap:var(--s4)}
.sec-hd .section-h{margin-bottom:0}

/* 거래 현황 바 */
.trade-bar{background:#fff;border:1px solid var(--border);border-left:3px solid var(--three);border-radius:var(--radius);padding:var(--s3) var(--s5);display:flex;align-items:center;gap:var(--s5);margin-bottom:var(--s5);flex-wrap:wrap;box-shadow:var(--shadow-sm)}
.trade-bar__item{display:flex;align-items:center;gap:var(--s2);font-size:13px;font-weight:600;color:var(--text-sub)}
.trade-bar__num{font-size:18px;font-weight:900;color:var(--three)}
.trade-bar__num.brand{color:var(--brand)}
.trade-bar__div{width:1px;height:20px;background:var(--border);flex-shrink:0}
.live-tag{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--red);background:#fef2f2;padding:4px 10px;border-radius:20px;flex-shrink:0;border:1px solid #fecaca}
.live-tag span{width:6px;height:6px;background:var(--red);border-radius:50%;animation:ldPulse 1.4s infinite}

/* 거래 흐름 가이드 (홈) */
.trade-flow{display:flex;align-items:center;gap:0;margin:var(--s6) 0;background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm)}
.trade-flow__step{flex:1;text-align:center;padding:var(--s4) var(--s3);position:relative}
.trade-flow__step:not(:last-child)::after{content:'→';position:absolute;right:-10px;top:50%;transform:translateY(-50%);font-size:16px;color:var(--text-mute);z-index:1}
.trade-flow__step:hover{background:var(--three-l)}
.trade-flow__icon{font-size:24px;margin-bottom:var(--s2)}
.trade-flow__label{font-size:12px;font-weight:700;color:var(--text);margin-bottom:3px}
.trade-flow__desc{font-size:10px;color:var(--text-mute)}

/* 주간 TOP 섹션 */
.weekly-top-section{background:linear-gradient(135deg,#1e3a5f 0%,#1d4ed8 60%,#7c3aed 100%);border-radius:var(--radius-lg);padding:var(--s5) var(--s6);margin-bottom:var(--s5);color:#fff;position:relative;overflow:hidden}
.weekly-top-section::before{content:'THIS WEEK';position:absolute;right:var(--s5);top:50%;transform:translateY(-50%);font-size:60px;font-weight:900;color:rgba(255,255,255,.05);letter-spacing:-2px;white-space:nowrap;pointer-events:none}
.weekly-top-title{font-size:14px;font-weight:800;margin-bottom:var(--s3);display:flex;align-items:center;gap:var(--s2)}
.weekly-top-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3)}
.weekly-seller-card{background:rgba(255,255,255,.12);border-radius:var(--radius);padding:var(--s3) var(--s4);display:flex;align-items:center;gap:var(--s3);cursor:pointer;transition:background var(--fast)}
.weekly-seller-card:hover{background:rgba(255,255,255,.2)}
.weekly-seller-av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;border:2px solid rgba(255,255,255,.3)}
.weekly-seller-name{font-size:13px;font-weight:700;color:#fff}
.weekly-seller-spec{font-size:10px;color:rgba(255,255,255,.7)}
.weekly-seller-count{font-size:14px;font-weight:900;color:#6ee7b7;margin-left:auto}

/* 수수료 비교 테이블 */
.fee-compare-table{width:100%;border-collapse:collapse;border-radius:var(--radius);overflow:hidden}
.fee-compare-table th,.fee-compare-table td{padding:var(--s3) var(--s4);text-align:left;font-size:13px;border-bottom:1px solid rgba(255,255,255,.1)}
.fee-compare-table th{font-size:10px;font-weight:700;color:rgba(255,255,255,.55);letter-spacing:.5px;background:rgba(0,0,0,.15)}
.fee-compare-table tr:last-child td{border-bottom:none}
.fee-compare-table td{color:rgba(255,255,255,.8)}
.fee-compare-table .rslx-row td{color:#6ee7b7;font-weight:800;background:rgba(5,150,105,.2)}

/* 수익 계산기 */
.profit-calc{background:rgba(255,255,255,.1);border-radius:var(--radius-lg);padding:var(--s5);backdrop-filter:blur(4px)}
.profit-calc__title{font-size:14px;font-weight:800;color:#fff;margin-bottom:var(--s4)}
.profit-calc__row{display:flex;justify-content:space-between;align-items:center;padding:var(--s2) 0;border-bottom:1px solid rgba(255,255,255,.1)}
.profit-calc__row:last-child{border-bottom:none;padding-top:var(--s3)}
.profit-calc__label{font-size:13px;color:rgba(255,255,255,.7)}
.profit-calc__value{font-size:14px;font-weight:700;color:#fff}
.profit-calc__value.three{color:#6ee7b7;font-size:18px;font-weight:900}
.profit-calc__value.red{color:#fca5a5}

/* 최근 본 상품 */
.recent-viewed{display:flex;gap:var(--s3);overflow-x:auto;padding-bottom:var(--s2)}
.recent-viewed::-webkit-scrollbar{height:3px}
.recent-viewed::-webkit-scrollbar-thumb{background:var(--border-d);border-radius:2px}
.recent-item{flex-shrink:0;width:100px;cursor:pointer;transition:all var(--fast)}
.recent-item:hover{transform:translateY(-2px)}
.recent-item__img{width:100px;height:100px;background:var(--bg-soft);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:36px;border:1px solid var(--border);margin-bottom:var(--s1)}
.recent-item__name{font-size:11px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recent-item__price{font-size:11px;color:var(--three);font-weight:700}

/* 비로그인 블러 오버레이 */
.login-required-overlay{position:absolute;inset:0;background:rgba(255,255,255,.85);backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;border-radius:var(--radius)}
.login-required-overlay p{font-size:13px;font-weight:700;color:var(--text-sub);margin-bottom:var(--s3);text-align:center}

@media(max-width:768px){
  .bottom-nav{display:grid}
  .fab-btn{display:flex}
  .weekly-top-grid{grid-template-columns:1fr}
  .trade-flow{flex-direction:column}
  .trade-flow__step::after{display:none}
}