/* ========================================================================
   ?€?μ삦???쒓렇??components ??移대뱶 / 踰꾪듉 / 誘몃땲移대뱶 / ?듦퀎 / 罹먮윭?€
   ======================================================================== */

/* ===== 蹂대씪 ?쇰윭?ㅽ듃 移대뱶 ===== */
.s-illust-card {
  margin: 0 0 16px;
  background: var(--violet-bg);
  border-radius: 0;
  padding: 20px;
  display: flex; align-items: center; gap: 12px;
  position: relative; overflow: hidden;
}
.s-illust-card .text {
  flex: 1; font-size: 15px; font-weight: 700; line-height: 1.5; color: var(--gray-900);
}
.s-illust-card .text em {
  position: relative; display: inline-block;
}
.s-illust-card .text em::before {
  content: ''; position: absolute; left: -2px; right: -2px; bottom: 1px;
  height: 9px; background: var(--yellow); z-index: -1; border-radius: 2px;
}
.s-illust-card .illust {
  width: 80px; height: 80px; border-radius: 50%;
  background: linear-gradient(135deg, #FFD0B8 0%, #FFB89C 100%);
  display: flex; align-items: center; justify-content: center;
  font-size: 38px; flex-shrink: 0;
}

/* ===== 2移?誘몃땲 遺꾩꽍 移대뱶 ===== */
.s-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 20px; background: var(--white); margin: 0 0 16px; }
.s-mini-card {
  background: var(--white); border-radius: var(--r-md);
  padding: 18px 16px; position: relative;
  display: flex; flex-direction: column; gap: 4px;
}
.s-mini-card .name { font-size: 14px; font-weight: 700; }
.s-mini-card .desc { font-size: 12px; color: var(--gray-500); font-weight: 500; }
.s-mini-card .arr {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  color: var(--gray-400);
}

/* ===== 媛€議??€ 移대뱶 ===== */
.s-family-card {
  margin: 0 0 16px;
  background: var(--white); border-radius: 0;
  padding: 20px;
  display: flex; align-items: center; gap: 12px;
}
.s-family-card .ico {
  width: 36px; height: 36px; border-radius: 10px;
  background: var(--violet-bg);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
}
.s-family-card .text { flex: 1; }
.s-family-card .t1 { font-size: 14px; font-weight: 700; }
.s-family-card .t2 { font-size: 12px; color: var(--gray-500); font-weight: 500; margin-top: 2px; }

/* ===== 愿€?щЪ嫄?/ 寃쎈ℓ臾쇨굔 移대뱶 (progress ?ы븿) ===== */
.s-asset-list { padding: 0; display: flex; flex-direction: column; gap: 10px; margin-bottom: 24px; }
.s-asset-card {
  background: var(--white); border-radius: var(--r-md);
  padding: 20px; position: relative;
}
.s-asset-alert {
  position: absolute; top: 14px; right: 14px;
  background: var(--coral); color: var(--white);
  font-size: 11px; font-weight: 700;
  padding: 4px 9px; border-radius: 20px;
  display: flex; align-items: center; gap: 4px;
}
.s-asset-head { display: flex; align-items: start; justify-content: space-between; margin-bottom: 8px; padding-right: 70px; }
.s-asset-title { font-size: 15px; font-weight: 800; letter-spacing: -0.03em; }
.s-asset-sub { font-size: 12px; color: var(--gray-500); font-weight: 500; margin-top: 2px; }
.s-asset-logo {
  position: absolute; top: 14px; right: 14px;
  font-size: 11px; font-weight: 800; color: var(--gray-500);
}
.s-asset-tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 10px 0; }
.s-asset-tag {
  padding: 4px 9px; border-radius: 6px; background: var(--gray-100);
  font-size: 11px; font-weight: 600; color: var(--gray-700);
}
.s-asset-bar-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.s-asset-bar { flex: 1; height: 6px; background: var(--gray-100); border-radius: 3px; overflow: hidden; }
.s-asset-bar > div { height: 100%; background: var(--violet); border-radius: 3px; }
.s-asset-progress { font-size: 12px; font-weight: 700; color: var(--violet); white-space: nowrap; }
.s-asset-foot { display: flex; align-items: center; justify-content: space-between; }
.s-asset-price { font-size: 18px; font-weight: 800; letter-spacing: -0.03em; }
.s-asset-price .unit { font-size: 13px; font-weight: 700; color: var(--gray-700); margin-left: 1px; }
.s-asset-meta { font-size: 11px; color: var(--gray-500); font-weight: 500; text-align: right; }
.s-asset-foot .arr { color: var(--gray-400); }

/* ===== 4-quad 硫붾돱 ?꾩씠肄?===== */
.s-quad-card {
  margin: 0 0 16px;
  background: var(--white); border-radius: 0;
  padding: 20px 0;
  display: grid; grid-template-columns: repeat(4, 1fr);
}
.s-quad { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.s-quad .ico {
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
}
.s-quad .lbl { font-size: 11px; font-weight: 600; color: var(--gray-700); }

/* ===== 移댄뀒怨좊━ 8媛?洹몃━??===== */
.s-cats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px;
  margin: 0 0 16px;
  background: var(--white); border-radius: 0;
  padding: 20px 12px;
}
.s-cat { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 8px 2px; border-radius: var(--r-sm); }
.s-cat .ico {
  width: 52px; height: 52px; border-radius: 14px;
  background: var(--violet-soft); color: var(--violet);
  display: flex; align-items: center; justify-content: center;
}
.s-cat .ico svg { width: 28px; height: 28px; }
.s-cat .lbl { font-size: 12px; font-weight: 600; color: var(--gray-700); }

/* ===== ?ㅼ떆媛?吏꾪뻾以?寃€??移대뱶 ===== */
.s-quick {
  margin: 0 0 16px;
  background: linear-gradient(135deg, #1A1530 0%, #0F0B22 60%, #1A1530 100%);
  border-radius: 0; padding: 20px;
  color: #F5F1E4; position: relative; overflow: hidden;
  box-shadow: 0 2px 8px rgba(15, 11, 34, 0.25);
}
.s-quick::after {
  content: ''; position: absolute; right: -30px; top: -30px;
  width: 160px; height: 160px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,215,120,0.18) 0%, rgba(255,215,120,0) 65%);
  pointer-events: none;
}
.s-quick-label { font-size: 12px; color: #C9B57A; margin-bottom: 4px; font-weight: 600; letter-spacing: 0.04em; }
.s-quick-title { font-size: 17px; font-weight: 800; margin-bottom: 14px; line-height: 1.35; letter-spacing: -0.03em; color: #F5F1E4; }
.s-quick-input {
  background: var(--white); border-radius: 12px; padding: 12px 14px;
  display: flex; align-items: center; gap: 10px; color: var(--gray-500);
  font-size: 13px; font-weight: 500;
}
.s-quick-input svg { color: var(--violet); flex-shrink: 0; }

/* s-quick ?곸뿭 ?ш굔?꾨룄 select ???쒓렇????*/
.s-quick-sel {
  flex: 0 0 95px;
  width: 95px;
  height: 42px;
  border: 0;
  border-radius: 10px;
  padding: 0 12px;
  font-size: 13px;
  font-family: var(--font-base);
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%238A8A99' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 10px center;
  color: var(--gray-900);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
}
.s-quick-sel:focus { outline: 2px solid #FFD770; outline-offset: -2px; }
.s-quick-stats {
  display: flex; gap: 18px; margin-top: 16px; position: relative; z-index: 1;
}
.s-quick-stats > div { display: flex; flex-direction: column; }
.s-quick-stats .v { font-size: 20px; font-weight: 800; letter-spacing: -0.03em; }
.s-quick-stats .l { font-size: 11px; opacity: 0.8; margin-top: 2px; }

/* ===== ?ㅻ뒛??異붿쿇臾쇨굔 罹먮윭?€ ===== */
.s-reco-head {
  padding: 16px 20px 12px;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 64px;
  box-sizing: border-box;
}
.s-reco-head .left { display: flex; flex-direction: column; justify-content: center; min-height: 36px; }
.s-reco-head .left .title { font-size: 16px; font-weight: 800; letter-spacing: -0.03em; }
.s-reco-head .left .title em { color: var(--violet); }
.s-reco-head .left .sub { font-size: 12px; color: var(--gray-500); margin-top: 2px; font-weight: 500; }
.s-reco-head .more { font-size: 12px; color: var(--gray-500); font-weight: 600; }
.s-reco-scroll {
  display: flex; gap: 12px; overflow-x: auto;
  padding: 0 20px 20px;
  scrollbar-width: none; margin: 0 0 16px;
  background: var(--white);
}
.s-reco-scroll::-webkit-scrollbar { display: none; }
.s-reco-card { flex: 0 0 220px; background: var(--white); border-radius: var(--r-md); overflow: hidden; }
.s-reco-img { height: 120px; background: linear-gradient(135deg, #DDD7FF 0%, #C6BCFF 100%); position: relative; }
.s-reco-tag {
  position: absolute; top: 10px; left: 10px;
  padding: 4px 9px; border-radius: 20px;
  background: rgba(255,255,255,0.95); color: var(--violet);
  font-size: 11px; font-weight: 700;
}
.s-reco-fav {
  position: absolute; top: 10px; right: 10px;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(255,255,255,0.95);
  display: flex; align-items: center; justify-content: center;
  color: var(--gray-500);
}
.s-reco-body { padding: 12px; }
.s-reco-loc { font-size: 11px; color: var(--gray-500); font-weight: 600; margin-bottom: 4px; }
.s-reco-title {
  font-size: 13px; font-weight: 700; line-height: 1.35; margin-bottom: 8px;
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
}
.s-reco-price-row { display: flex; align-items: end; justify-content: space-between; }
.s-reco-price { font-size: 16px; font-weight: 800; color: var(--gray-900); letter-spacing: -0.03em; }
.s-reco-price .unit { font-size: 11px; font-weight: 700; color: var(--gray-700); margin-left: 1px; }
.s-reco-disc {
  font-size: 11px; font-weight: 800; color: var(--coral);
  background: #FFE9E9; padding: 3px 7px; border-radius: 6px;
}

/* ===== ?대쾲??寃쎈ℓ?꾪솴 ?듦퀎 ===== */
.s-section-head {
  padding: 16px 20px 12px;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 64px;
  box-sizing: border-box;
}
.s-section-head .s-section-title-grp { display: flex; flex-direction: column; justify-content: center; min-height: 36px; }
.s-section-head .s-section-title-grp .ttl { font-size: 16px; font-weight: 800; letter-spacing: -0.03em; }
.s-section-head .s-section-title-grp .ttl em { color: var(--violet); }
.s-section-head .s-section-title-grp .sub { font-size: 12px; color: var(--gray-500); margin-top: 2px; font-weight: 500; }
.s-section-head .more { font-size: 12px; color: var(--gray-500); font-weight: 600; }

.s-stats { background: var(--white); border-radius: 0; padding: 20px; margin: 0 0 16px; }
.s-stats-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.s-stats-head .date { font-size: 12px; color: var(--gray-500); font-weight: 600; }
.s-stats-head .month { font-size: 14px; font-weight: 700; }
.s-stats-total { font-size: 13px; color: var(--gray-500); margin-bottom: 2px; }
.s-stats-amt { font-size: 28px; font-weight: 800; color: var(--violet); margin-bottom: 16px; letter-spacing: -0.04em; }
.s-stats-amt .unit { font-size: 16px; color: var(--gray-700); font-weight: 700; margin-left: 2px; }
.s-stats-list { display: flex; flex-direction: column; gap: 10px; }
.s-stats-row { display: flex; align-items: center; justify-content: space-between; }
.s-stats-row .left { display: flex; align-items: center; gap: 10px; }
.s-stats-row .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--violet); }
.s-stats-row:nth-child(2) .dot { background: var(--green); }
.s-stats-row:nth-child(3) .dot { background: var(--orange); }
.s-stats-row:nth-child(4) .dot { background: var(--coral); }
.s-stats-row .name { font-size: 13px; font-weight: 600; color: var(--gray-700); }
.s-stats-row .cnt { font-size: 13px; font-weight: 800; }

/* ===== "?대윴 ?쒕퉬?ㅻ뒗 ?대븣??" ===== */
.s-svc-head {
  padding: 16px 20px 12px;
  display: flex; align-items: center; justify-content: space-between;
  min-height: 64px;
  box-sizing: border-box;
}
.s-svc-head .title { font-size: 15px; font-weight: 700; }
.s-svc-head .more { font-size: 12px; color: var(--gray-500); font-weight: 600; }
.s-svc { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 20px; background: var(--white); margin: 0 0 16px; }
.s-svc-item {
  background: var(--white); border-radius: var(--r-md);
  padding: 16px;
  display: flex; align-items: center; justify-content: space-between;
}
.s-svc-item .text .t1 { font-size: 14px; font-weight: 700; line-height: 1.3; }
.s-svc-item .text .t2 { font-size: 11px; color: var(--gray-500); font-weight: 500; margin-top: 2px; }
.s-svc-item .ico {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--gray-100);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: var(--gray-900);
}

/* ===== ?대떖???됱궗 ===== */
.s-events-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 20px 12px;
}
.s-events-head .title { font-size: 16px; font-weight: 700; color: var(--gray-900); }
.s-events-head .more  { font-size: 12px; color: var(--gray-500); }

.s-events {
  padding: 0 20px 16px;
  display: flex; flex-direction: column; gap: 10px;
}
.s-event-banner {
  position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 12px;
  height: 100px; padding: 0 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, #1A1530 0%, #0F0B22 60%, #1A1530 100%);
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(15, 11, 34, 0.18);
}
.s-event-banner__deco {
  position: absolute; right: -30px; top: -30px;
  width: 130px; height: 130px;
  background: radial-gradient(circle, rgba(255, 215, 120, 0.22) 0%, rgba(255, 215, 120, 0) 60%);
  pointer-events: none;
}
.s-event-banner__body {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 4px;
  position: relative; z-index: 1;
}
.s-event-banner__sub {
  font-size: 15px; font-weight: 500; color: #C9B57A;
  letter-spacing: 0.2px;
}
.s-event-banner__title {
  font-size: 15px; font-weight: 700; color: #F5F1E4;
  line-height: 1.35;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.s-event-banner__title em {
  color: #FFD770; font-style: normal; font-weight: 800;
}
.s-event-banner__meta {
  font-size: 15px; color: rgba(245, 241, 228, 0.6);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.s-event-banner__cta {
  flex-shrink: 0;
  position: relative; z-index: 1;
  display: inline-flex; align-items: center; justify-content: center;
  height: 30px; padding: 0 12px;
  border-radius: 999px;
  background: #FFD770; color: #1A1530;
  font-size: 12px; font-weight: 700;
  letter-spacing: -0.2px;
}

/* ===== "?덈릺???쒓렇?? 媛€濡??ㅽ겕濡?===== */
.s-signals-head { padding: 16px 20px 12px; font-size: 15px; font-weight: 800; min-height: 64px; display: flex; align-items: center; box-sizing: border-box; }
.s-signals {
  display: flex; gap: 10px; overflow-x: auto;
  padding: 0 20px 20px;
  scrollbar-width: none; margin: 0 0 16px;
  background: var(--white);
}
.s-signals::-webkit-scrollbar { display: none; }
.s-signal-card {
  flex: 0 0 175px;
  background: var(--white); border-radius: var(--r-md);
  overflow: hidden;
}
.s-signal-card .img {
  height: 110px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; color: var(--white);
  text-align: center; line-height: 1.4; padding: 12px;
}
.s-signal-card:nth-child(1) .img { background: #4ECDC4; }
.s-signal-card:nth-child(2) .img { background: #56C8E0; }
.s-signal-card:nth-child(3) .img { background: var(--violet); }
.s-signal-card .body { padding: 12px; }
.s-signal-card .t1 {
  font-size: 13px; font-weight: 700; line-height: 1.4;
  overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}

/* ===== ?€??而ㅻ??덊떚 (?ㅼ씠踰?移댄럹) ===== */
.s-cafe {
  margin: 0 20px 16px;
  background: #fff;
  border: 1px solid var(--gray-200);
  border-radius: 14px;
  overflow: hidden;
}
.s-cafe__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px;
  background: #03C75A;
  color: #fff;
}
.s-cafe__brand { display: flex; align-items: center; gap: 8px; }
.s-cafe__logo {
  width: 22px; height: 22px; border-radius: 6px;
  background: rgba(255,255,255,0.18);
  display: inline-flex; align-items: center; justify-content: center;
}
.s-cafe__title { font-size: 15px; font-weight: 700; letter-spacing: -0.2px; }
.s-cafe__more {
  font-size: 12px; font-weight: 600; color: #fff;
  text-decoration: none;
  background: rgba(255,255,255,0.18);
  padding: 5px 10px; border-radius: 999px;
}
.s-cafe__list { list-style: none; margin: 0; padding: 0; }
.s-cafe__group + .s-cafe__group { border-top: 1px solid var(--gray-100); }
.s-cafe__cat-row {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 16px 8px;
  text-decoration: none; color: var(--gray-900);
}
.s-cafe__cat {
  flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; height: 22px; padding: 0 8px;
  background: #E6F8EC; color: #03C75A;
  border-radius: 6px;
  font-size: 11px; font-weight: 700;
}
.s-cafe__lbl {
  flex: 1; min-width: 0;
  font-size: 13px; font-weight: 700; color: var(--gray-900);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.s-cafe__arr { color: var(--gray-400); font-size: 14px; }

.s-cafe__posts { list-style: none; margin: 0 0 6px; padding: 0 16px 4px; }
.s-cafe__posts a {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0 6px 6px;
  text-decoration: none;
}
.s-cafe__dot {
  flex-shrink: 0;
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--gray-400);
}
.s-cafe__ptitle {
  flex: 1; min-width: 0;
  font-size: 15px; font-weight: 500; color: var(--gray-700);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.s-cafe__pdate {
  flex-shrink: 0;
  font-size: 11px; color: var(--gray-500);
}

/* ===== ?몃옉 CTA ?€踰꾪듉 (?쒓렇?덉쿂) ===== */
.s-cta-yellow {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; margin: 0 0 8px;
  background: var(--yellow);
  border-radius: 0;
  padding: 20px;
  font-size: 15px; font-weight: 800; color: var(--gray-900);
}
.s-cta-yellow--big {
  padding: 0 20px;
  height: 60px;
  font-size: 18px; font-weight: 800; letter-spacing: -0.4px;
  gap: 10px;
  background: #415270;
  color: #fff;
}
.s-cta-yellow--big .chat-ico svg { width: 22px; height: 22px; }
.s-cta-yellow--big:active { background: #34425A; }
.s-cta-foot {
  text-align: center; font-size: 11px; color: var(--gray-500);
  margin: 0 0 16px; padding: 0 20px;
  font-weight: 500;
}
.s-cta-yellow .chat-ico {
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--gray-900); color: var(--yellow);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px;
}
/* (s-cta-foot ?꾩뿉???ъ젙?섎맖) */


/* ========================================================================
   .s-list ??怨듯넻 ??由ъ뒪??而댄룷?뚰듃 (A???⑦꽩)
   - ?좎뒪/移댁뭅?ㅻ콉???? 移대뱶 蹂대뜑 X, row ?ъ씠 1px 援щ텇??   - 紐⑤뱺 ?뱀뀡 ?ъ궗??媛€??(寃€?됲뤌 / MY 硫붾돱 / ?쇱젙 / ?ㅼ젙 ??
   ----- ?ъ슜 ?덉떆 -----
   <div class="s-list">
     <div class="s-list__row">
       <span class="s-list__label">?쇰꺼</span>
       <div class="s-list__content">...而⑦뀗痢?..</div>
     </div>
     ...
   </div>
   ======================================================================== */
.s-list {
  background: var(--white);
  border: none;
  border-radius: 0;
}
.s-list__row {
  display: grid;
  grid-template-columns: 70px 1fr;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  padding: 12px 20px;
  border-bottom: 1px solid var(--gray-100);
}
.s-list__row:last-child {
  border-bottom: 1px solid var(--gray-100);
}
.s-list__row--full {
  grid-template-columns: 1fr;
}
.s-list__row--tap {
  grid-template-columns: 1fr auto;
  cursor: pointer;
}
.s-list__row--tap:active {
  background: var(--gray-50);
}
.s-list__label {
  font-size: 14px;
  font-weight: 600;
  color: var(--gray-900);
  white-space: nowrap;
}
.s-list__content {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
  min-width: 0;
  font-size: 13px;
  color: var(--gray-700);
}
.s-list__content--right {
  justify-content: flex-end;
}
.s-list__chev {
  color: var(--gray-400);
  font-size: 16px;
}

/* ?뱀뀡 ?ㅻ뜑 (?좏깮) ??洹몃９??媛뺤“ ??*/
.s-list-head {
  padding: 12px 20px 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--violet);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* 蹂€??1: ?됯컙 而댄뙥??*/
.s-list--compact .s-list__row { padding: 8px 20px; min-height: 36px; }

/* 蹂€??2: ?쇰꺼 ???볤쾶 (湲??쇰꺼?? */
.s-list--label-wide .s-list__row { grid-template-columns: 100px 1fr; }

/* 蹂€??3: 援щ텇???놁쓬 (媛€??誘몃땲硫€) */
.s-list--seamless .s-list__row { border-bottom: 0; }

/* ===================================================
 * 怨듭떇 梨꾨꼸 洹몃━??(.s-channels) ??2:1:1 (?좏뒠釉???
 * =================================================== */
.s-channels-head {
  padding: 18px 20px 10px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--gray-900);
}
.s-channels-head em { color: var(--violet); font-style: normal; }

.s-channels-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 110px 80px;
  gap: 8px;
  padding: 0 20px 18px;
}
.s-channels-grid a {
  display: block;
  border-radius: 14px;
  overflow: hidden;
  background: var(--gray-100);
  position: relative;
  text-decoration: none;
}
.s-channels-grid a.s-ch--big { grid-column: 1 / 3; grid-row: 1; }
.s-channels-grid img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  image-rendering: -webkit-optimize-contrast;
}
.s-channels-grid .s-ch-lbl {
  position: absolute;
  bottom: 8px; left: 10px;
  background: rgba(255,255,255,0.95);
  color: var(--gray-900);
  font-size: 12px;
  font-weight: 800;
  padding: 3px 8px;
  border-radius: 6px;
  letter-spacing: -0.01em;
}

/* ===================================================
 * 硫붿씤 ?덉뼱濡?濡ㅻ쭅 諛곕꼫 (.s-main-banner)
 * ?€???щ씪?대뜑, 媛뺤쓽/硫ㅻ쾭????留덉????щ씪?대뱶 2~N?? * =================================================== */
.s-main-banner {
  position: relative;
  width: 100%;
  padding: 0;
  background: #fff;
}
.s-main-banner__viewport {
  position: relative;
  width: 100%;
  border-radius: 0;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: var(--gray-100);
}
.s-main-banner__track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.s-main-banner__slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: var(--gray-100);
}
.s-main-banner__dots {
  position: absolute;
  bottom: 16px; right: 30px;
  display: flex; gap: 5px;
  z-index: 2;
}
.s-main-banner__dots span {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
  transition: all 0.25s ease;
}
.s-main-banner__dots span.on {
  width: 18px;
  border-radius: 3px;
  background: #fff;
}

/* ===================================================
 * ?꾩씪 寃쎈ℓ ?쒖옣 6吏€??媛€濡??ㅽ겕濡?(.s-today-bar)
 * =================================================== */
.s-today-section {
  background: var(--white);
  padding: 4px 0 6px;
}
.s-today-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 18px 20px 10px;
}
.s-today-head__ttl {
  font-size: 16px; font-weight: 800;
  letter-spacing: -0.02em; color: var(--gray-900);
}
.s-today-head__ttl em { color: var(--violet); font-style: normal; }
.s-today-head__sub { font-size: 12px; color: var(--gray-500); margin-top: 3px; }
.s-today-head .more { font-size: 12px; color: var(--gray-500); white-space: nowrap; margin-top:2px; text-decoration:none; }

.s-today-scroll {
  display: flex; gap: 5px;
  overflow-x: auto;
  padding: 0 20px 18px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.s-today-scroll::-webkit-scrollbar { display: none; }

.s-today-card {
  flex: 0 0 168px;
  padding: 16px 14px 14px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 14px;
  display: flex; flex-direction: column;
  position: relative;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 1px 3px rgba(15,16,35,0.04);
  overflow: hidden;
}
.s-today-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px; background: var(--violet);
}
.s-today-card.is-link { cursor: pointer; }
.s-today-card.is-link::before { background: var(--gray-900); }
.s-today-card.is-link:hover { border-color: var(--violet); }
.s-today-card.is-link:hover::before { background: var(--violet); }

.s-today-card__label {
  font-size: 12px; font-weight: 600; color: var(--gray-700);
  display: flex; align-items: center; gap: 4px;
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}
.s-today-tag {
  display: inline-block;
  font-size: 12px; font-weight: 800;
  background: var(--violet-soft); color: var(--violet);
  padding: 2px 5px; border-radius: 4px;
  letter-spacing: 0.04em;
}
.s-today-card__num {
  font-size: 22px; font-weight: 800;
  color: var(--gray-900);
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.s-today-card__num .pre {
  font-size: 12px; font-weight: 600;
  color: var(--gray-700);
  margin-right: 3px;
}
.s-today-card__unit {
  font-size: 13px; font-weight: 600;
  color: var(--gray-700);
  margin-left: 1px;
}
.s-today-card__sub,
.s-today-card__change,
.s-today-card__case {
  font-size: 12px; color: var(--gray-500);
  margin-top: 8px;
  letter-spacing: -0.01em;
  line-height: 1.35;
}
.s-today-card__sub strong { color: var(--gray-900); font-weight: 700; }
.s-today-card__case .go {
  color: var(--violet); font-weight: 800;
  margin-left: 2px;
}

/* ===================================================
 * ?€?쩣V ?좏뒠釉??뱀뀡 (.s-yt-section)
 * 硫붿씤 ?뚮젅?댁뼱 (16:9) + ?몃꽕??3媛??ㅽ듃由? * =================================================== */
.s-yt-section {
  background: var(--white);
  padding: 18px 20px 22px;
  margin: 0 0 16px;
}
.s-yt-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px;
}
.s-yt-head__ttl {
  display: flex; align-items: center; gap: 8px;
  font-size: 16px; font-weight: 800;
  letter-spacing: -0.02em; color: var(--gray-900);
}
.s-yt-head__ttl em { color: var(--violet); font-style: normal; }
.s-yt-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px;
  background: #FF0000; color: #fff;
  border-radius: 5px;
  flex-shrink: 0;
}
.s-yt-badge svg { width: 14px; height: 14px; }
.s-yt-head .more {
  font-size: 12px; color: var(--gray-500);
  text-decoration: none; white-space: nowrap;
}

.s-yt-main {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  margin-bottom: 8px;
}
.s-yt-poster {
  position: absolute; inset: 0;
  cursor: pointer;
}
.s-yt-poster img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.s-yt-play {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.25);
  transition: background 0.2s;
}
.s-yt-poster:hover .s-yt-play { background: rgba(0,0,0,0.4); }
.s-yt-play svg {
  width: 58px; height: 40px;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,0.5));
}
.s-yt-main iframe {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  border: 0; display: block;
}

.s-yt-thumbs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.s-yt-thumbs::-webkit-scrollbar { display: none; }
.s-yt-thumb {
  position: relative;
  flex: 0 0 120px;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  background: #111;
  border: 2px solid transparent;
  transition: border-color 0.15s;
}
.s-yt-thumb img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.s-yt-thumb-play {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0,0,0,0.25);
  opacity: 0;
  transition: opacity 0.15s;
}
.s-yt-thumb:hover .s-yt-thumb-play { opacity: 1; }
.s-yt-thumb-play svg { width: 20px; height: 20px; }
.s-yt-thumb.active { border-color: var(--violet); }
.s-yt-thumb.active .s-yt-thumb-play {
  opacity: 1;
  background: rgba(124,92,255,0.25);
}

/* ===================================================
 * 臾쇨굔 ??궧 TOP10 (4??媛곸옄 媛€濡??ㅽ겕濡?
 * =================================================== */
.s-rank-wrap {
  background: var(--white);
  padding: 18px 0 22px;
  margin: 0 0 16px;
}
.s-rank-section-head {
  padding: 0 20px 14px;
}
.s-rank-section-head .ttl {
  font-size: 16px; font-weight: 800;
  letter-spacing: -0.02em; color: var(--gray-900);
}
.s-rank-section-head .ttl em { color: var(--violet); font-style: normal; }
.s-rank-section-head .sub {
  font-size: 12px; color: var(--gray-500); margin-top: 3px;
}

.s-rank-row { padding: 14px 0 18px; }
.s-rank-row + .s-rank-row {
  border-top: 1px solid var(--gray-100);
  margin-top: 4px;
}
.s-rank-row:last-child { padding-bottom: 0; }

.s-rank-row-head {
  display: flex; align-items: center; gap: 6px;
  padding: 0 20px 10px;
}
.s-rank-row-ico { font-size: 16px; flex-shrink: 0; }
.s-rank-row-ttl {
  flex: 1;
  font-size: 14px; font-weight: 800;
  letter-spacing: -0.02em; color: var(--gray-900);
}
.s-rank-row-ttl em {
  color: var(--violet); font-style: normal;
  font-size: 12px; font-weight: 700;
  margin-left: 4px;
}
.s-rank-more {
  font-size: 12px; color: var(--gray-500);
  text-decoration: none; white-space: nowrap;
}

.s-rank-scroll {
  display: flex; gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 0 20px 4px;
}
.s-rank-scroll::-webkit-scrollbar { display: none; }

.s-rank-card {
  flex: 0 0 170px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  display: flex; flex-direction: column;
}
.s-rank-card__thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  background-size: cover;
  background-position: center;
  background-color: var(--gray-100);
  position: relative;
}
.s-rank-card__num {
  position: absolute; top: 8px; left: 8px;
  background: rgba(15,16,35,0.85); color: #fff;
  width: 22px; height: 22px;
  border-radius: 6px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800;
  letter-spacing: -0.02em;
}
.s-rank-card__num.is-top {
  background: var(--violet);
}
.s-rank-card__body {
  padding: 10px 12px 12px;
  display: flex; flex-direction: column; gap: 2px;
}
.s-rank-card__case {
  font-size: 12px; font-weight: 700;
  color: var(--gray-900);
  letter-spacing: -0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-rank-card__addr {
  font-size: 12px; color: var(--gray-500);
  font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  margin-bottom: 4px;
}
.s-rank-card__val {
  font-size: 16px; font-weight: 800;
  color: var(--gray-900);
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.s-rank-card__sub {
  font-size: 12px; color: var(--gray-700);
  font-weight: 600;
}

/* === 由ъ뒪?명삎 ??궧 移대뱶 (媛€濡?row) === */
.s-rank-list-card {
  flex: 0 0 270px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  text-decoration: none;
  color: inherit;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
}
.s-rank-list-card__thumb {
  width: 60px; height: 60px;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  background-color: var(--gray-100);
  position: relative;
  flex-shrink: 0;
}
.s-rank-list-card__num {
  position: absolute; top: 4px; left: 4px;
  background: rgba(15,16,35,0.85); color: #fff;
  width: 18px; height: 18px;
  border-radius: 5px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800;
  letter-spacing: -0.02em;
}
.s-rank-list-card__num.is-top { background: var(--violet); }
.s-rank-list-card__body {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.s-rank-list-card__case {
  font-size: 12px; font-weight: 700;
  color: var(--gray-900);
  letter-spacing: -0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-rank-list-card__addr {
  font-size: 12px; color: var(--gray-500);
  font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-rank-list-card__price {
  text-align: right; flex-shrink: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.s-rank-list-card__val {
  font-size: 15px; font-weight: 800;
  color: var(--gray-900);
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.s-rank-list-card__sub {
  font-size: 12px; color: var(--gray-700);
  font-weight: 600;
}

/* === 二쇨컙 議고쉶??諭껋? (s-reco-card ?몃꽕???곗긽?? === */
.s-reco-img { position: relative; }
.s-reco-view {
  position: absolute;
  top: 8px; right: 8px;
  background: rgba(15,16,35,0.85);
  color: #fff;
  font-size: 12px; font-weight: 700;
  padding: 3px 6px 3px 5px;
  border-radius: 5px;
  display: flex; align-items: center; gap: 3px;
  letter-spacing: -0.02em;
}
.s-reco-view svg { flex-shrink: 0; }

/* ===================================================
 * 臾쇨굔 ??궧 ??landdata ?ㅽ???(?대?吏€ ?놁쓬, 5媛?list, 媛€濡??ㅽ겕濡?
 * =================================================== */
.s-rank-scroll-h {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 0 20px 8px;
}
.s-rank-scroll-h::-webkit-scrollbar { display: none; }

.s-rank-card2 {
  flex: 0 0 320px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  overflow: hidden;
  display: flex; flex-direction: column;
}
.s-rank-card2__head {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--gray-100);
  background: var(--gray-50);
}
.s-rank-card2__ico {
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.s-rank-card2__ttl {
  font-size: 13px; font-weight: 800;
  letter-spacing: -0.02em; color: var(--gray-900);
}
.s-rank-card2__ttl em {
  color: var(--violet); font-style: normal;
  font-size: 12px; font-weight: 700;
  margin-left: 4px;
}
.s-rank-card2__list {
  display: flex; flex-direction: column;
}
.s-rank-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--gray-100);
  text-decoration: none; color: inherit;
  transition: background 0.12s;
}
.s-rank-item:last-child { border-bottom: 0; }
.s-rank-item:hover { background: var(--gray-50); }
.s-rank-item__num {
  flex-shrink: 0;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  background: var(--gray-100); color: var(--gray-700);
  border-radius: 6px;
  font-size: 12px; font-weight: 800;
  letter-spacing: -0.02em;
}
.s-rank-item__num.is-top {
  background: var(--violet); color: #fff;
}
.s-rank-item__info {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.s-rank-item__name {
  font-size: 12px; font-weight: 700;
  color: var(--gray-900);
  letter-spacing: -0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-rank-item__meta {
  font-size: 12px; color: var(--gray-500);
  font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-rank-item__badge {
  flex-shrink: 0;
  display: flex; flex-direction: column;
  align-items: flex-end; gap: 2px;
}
.s-rank-item__val {
  font-size: 13px; font-weight: 800;
  color: var(--gray-900);
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.s-rank-item__sub {
  font-size: 12px; color: var(--gray-700);
  font-weight: 600;
}

/* ===================================================
 * 二쇨컙 議고쉶???믪? 臾쇨굔 (landdata ?ㅽ???由ъ뒪?? ?대?吏€ X)
 * =================================================== */
.s-weekly-wrap {
  padding: 18px 20px 16px;
  background: var(--white);
  margin: 0 0 16px;
}
.s-weekly-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: 12px;
  overflow: hidden;
}
.s-weekly-card__head {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px;
  background: var(--gray-50);
  border-bottom: 1px solid var(--gray-100);
}
.s-weekly-card__ico { flex-shrink: 0; display: inline-flex; }
.s-weekly-card__ttl {
  flex: 1;
  font-size: 13px; font-weight: 800;
  letter-spacing: -0.02em; color: var(--gray-900);
}
.s-weekly-card__ttl em { color: var(--violet); font-style: normal; }
.s-weekly-card__tag {
  display: inline-block;
  background: var(--violet-soft); color: var(--violet);
  font-size: 12px; font-weight: 800;
  padding: 2px 6px; border-radius: 5px;
  margin-left: 4px;
  letter-spacing: 0.02em;
}
.s-weekly-card__sub {
  font-size: 12px; color: var(--gray-500);
  font-weight: 600;
  white-space: nowrap;
}
.s-weekly-card__list { display: flex; flex-direction: column; }
.s-weekly-item {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--gray-100);
  text-decoration: none; color: inherit;
  transition: background 0.12s;
}
.s-weekly-item:last-child { border-bottom: 0; }
.s-weekly-item:hover { background: var(--gray-50); }
.s-weekly-item__num {
  flex-shrink: 0;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  background: var(--gray-100); color: var(--gray-700);
  border-radius: 6px;
  font-size: 12px; font-weight: 800;
  letter-spacing: -0.02em;
}
.s-weekly-item__num.is-top {
  background: var(--violet); color: #fff;
}
.s-weekly-item__info {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.s-weekly-item__name {
  font-size: 12px; font-weight: 700;
  color: var(--gray-900);
  letter-spacing: -0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-weekly-item__meta {
  font-size: 12px; color: var(--gray-500);
  font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.s-weekly-item__badge {
  flex-shrink: 0;
  display: flex; flex-direction: column;
  align-items: flex-end; gap: 2px;
}
.s-weekly-item__val {
  font-size: 14px; font-weight: 800;
  color: var(--gray-900);
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.s-weekly-item__sub {
  font-size: 12px; color: var(--gray-700);
  font-weight: 600;
}

/* 二쇨컙議고쉶???꾩씠?쒖뿉 ?묒? ?몃꽕??*/
.s-weekly-item__thumb {
  flex-shrink: 0;
  width: 38px; height: 38px;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
  background-color: var(--gray-100);
}

/* ===================================================
 * ?€?쩣V 硫ㅻ쾭???꾨줈紐⑥뀡 移대뱶
 * =================================================== */
.s-yt-promo {
  display: block;
  position: relative;
  margin: 0 20px 16px;
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(135deg, var(--violet) 0%, var(--violet-strong) 100%);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(124,92,255,0.22);
}
.s-yt-promo__bg {
  position: absolute;
  top: -40px; right: -30px;
  width: 180px; height: 180px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
}
.s-yt-promo__bg::before {
  content: '';
  position: absolute;
  top: 30px; right: 30px;
  width: 90px; height: 90px;
  border-radius: 50%;
  background: rgba(255,255,255,0.06);
}
.s-yt-promo__body {
  position: relative;
  padding: 20px 22px 18px;
  z-index: 1;
}
.s-yt-promo__badge {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,0.18);
  color: #fff;
  font-size: 12px; font-weight: 700;
  padding: 4px 9px 4px 7px;
  border-radius: 20px;
  margin-bottom: 12px;
  letter-spacing: 0.02em;
}
.s-yt-promo__title {
  font-size: 22px; font-weight: 800;
  letter-spacing: -0.04em;
  margin-bottom: 6px;
  line-height: 1.2;
}
.s-yt-promo__title em {
  font-style: normal;
  background: #fff; color: var(--violet);
  padding: 1px 7px;
  border-radius: 6px;
  margin-left: 3px;
}
.s-yt-promo__desc {
  font-size: 12px;
  opacity: 0.92;
  margin-bottom: 12px;
  font-weight: 500;
  letter-spacing: -0.01em;
}
.s-yt-promo__perks {
  list-style: none;
  padding: 0; margin: 0 0 16px;
  display: flex; flex-direction: column; gap: 5px;
}
.s-yt-promo__perks li {
  font-size: 12px; font-weight: 600;
  opacity: 0.95;
  display: flex; align-items: center; gap: 6px;
  letter-spacing: -0.01em;
}
.s-yt-promo__perks li::before {
  content: '✓';
  color: #FFE96B;
  font-size: 12px; font-weight: 800;
  flex-shrink: 0;
}
.s-yt-promo__cta {
  display: inline-flex; align-items: center; gap: 4px;
  background: #fff; color: var(--violet);
  font-size: 13px; font-weight: 800;
  padding: 10px 16px;
  border-radius: 10px;
  letter-spacing: -0.02em;
}

/* === 硫ㅻ쾭???꾨줈紐⑥뀡 移대뱶 ?곹깭 蹂€??=== */
/* is-active??湲곕낯 蹂대씪 洹몃?濡??ъ슜 (援щ텇 ?꾩슂 ??媛뺤“留? */
.s-yt-promo.is-active .s-yt-promo__badge {
    background: rgba(255,255,255,0.28);
}

.s-yt-promo.is-warn {
    background: linear-gradient(135deg, #E8A23A 0%, #B96E12 100%);
    box-shadow: 0 4px 14px rgba(232,162,58,0.22);
}
.s-yt-promo.is-warn .s-yt-promo__title em { color: #B96E12; }
.s-yt-promo.is-warn .s-yt-promo__cta { color: #B96E12; }

/* ===================================================
 * 硫ㅻ쾭???꾨줈紐⑥뀡 移대뱶 v2 ??媛뺥솕??寃곗젣 ?좊룄
 * =================================================== */
.s-mship-promo {
    position: relative;
    margin: 0 20px 16px;
    border-radius: 16px;
    overflow: hidden;
    padding: 14px 16px 14px;
    background: linear-gradient(135deg, var(--violet) 0%, var(--violet-strong) 100%);
    color: #fff;
    box-shadow: 0 4px 14px rgba(124,92,255,0.22);
}
.s-mship-promo > .s-mship-promo__deco {
    position: absolute; top: -55px; right: -60px;
    width: 210px; height: 210px; border-radius: 50%;
    background: rgba(255,255,255,0.09);
    pointer-events: none;
    z-index: 0;
}
.s-mship-promo__deco::before {
    content: ''; position: absolute;
    top: 36px; right: 36px;
    width: 110px; height: 110px; border-radius: 50%;
    background: rgba(255,255,255,0.07);
}
.s-mship-promo > *:not(.s-mship-promo__deco) { position: relative; z-index: 1; }

.s-mship-promo__head {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 8px;
}
.s-mship-promo__badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: rgba(255,255,255,0.22);
    font-size: 12px; font-weight: 800;
    padding: 5px 10px 5px 8px;
    border-radius: 20px;
    letter-spacing: 0.02em;
}
.s-mship-promo__discount {
    margin-left: auto;
    background: var(--yellow);
    color: var(--gray-900);
    font-size: 12px; font-weight: 900;
    padding: 4px 10px;
    border-radius: 6px;
    letter-spacing: -0.01em;
    box-shadow: 0 2px 8px rgba(255,233,107,0.4);
}

.s-mship-promo__title {
    font-size: 17px; font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.28;
    margin-bottom: 8px;
}
.s-mship-promo__title em {
    font-style: normal;
    background: #fff;
    color: var(--violet);
    padding: 1px 8px;
    border-radius: 7px;
    letter-spacing: -0.03em;
}

.s-mship-promo__priceRow {
    display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px dashed rgba(255,255,255,0.25);
}
.s-mship-promo__priceRow .orig {
    font-size: 13px; font-weight: 600;
    color: rgba(255,255,255,0.55);
    text-decoration: line-through;
}
.s-mship-promo__priceRow .orig span { font-size: 12px; }
.s-mship-promo__priceRow .now {
    font-size: 24px; font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 1;
}
.s-mship-promo__priceRow .now span {
    font-size: 16px; font-weight: 800;
    margin-left: 1px;
}
.s-mship-promo__priceRow .cycle {
    font-size: 12px; font-weight: 600;
    opacity: 0.85;
}

.s-mship-promo__perks {
    list-style: none; padding: 0; margin: 0 0 12px;
    display: flex; flex-direction: column; gap: 5px;
}
.s-mship-promo__perks li {
    display: flex; align-items: center; gap: 7px;
    font-size: 12px; font-weight: 500;
    letter-spacing: -0.01em;
}
.s-mship-promo__perks li .ico {
    flex-shrink: 0;
    width: 15px; height: 15px;
    background: rgba(255,255,255,0.22);
    color: #fff;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}
.s-mship-promo__perks li strong {
    font-weight: 800;
    background: rgba(255,255,255,0.14);
    padding: 1px 5px;
    border-radius: 4px;
    margin: 0 1px;
}

.s-mship-promo__cta-group {
    display: flex; gap: 6px;
    margin-bottom: 8px;
}
.s-mship-promo__cta-main {
    flex: 1;
    display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    background: #fff;
    color: var(--violet);
    font-size: 14px; font-weight: 800;
    padding: 11px 14px;
    border-radius: 10px;
    text-decoration: none;
    letter-spacing: -0.02em;
    box-shadow: 0 3px 10px rgba(0,0,0,0.12);
    transition: transform 0.15s ease;
}
.s-mship-promo__cta-main:hover { transform: translateY(-1px); }
.s-mship-promo__cta-main:active { transform: translateY(0); }
.s-mship-promo__cta-sub {
    flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,0.18);
    color: #fff;
    font-size: 12px; font-weight: 700;
    padding: 11px 14px;
    border-radius: 10px;
    text-decoration: none;
    letter-spacing: -0.02em;
    border: 1px solid rgba(255,255,255,0.22);
}

.s-mship-promo__trust {
    display: flex; align-items: center; gap: 5px;
    font-size: 12px; font-weight: 500;
    opacity: 0.85;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 0;
}
.s-mship-promo__trust .dot { opacity: 0.5; }
.s-mship-promo__trust span { display: inline-flex; align-items: center; gap: 4px; }

/* === 硫ㅻ쾭???곹깭 移대뱶 (active / warn) === */
.s-mship-status {
    margin: 0 20px 16px;
    padding: 20px 22px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--violet) 0%, var(--violet-strong) 100%);
    color: #fff;
    box-shadow: 0 4px 14px rgba(124,92,255,0.22);
    position: relative; overflow: hidden;
}
.s-mship-status::after {
    content: ''; position: absolute;
    top: -40px; right: -30px;
    width: 160px; height: 160px; border-radius: 50%;
    background: rgba(255,255,255,0.08);
}
.s-mship-status--warn {
    background: linear-gradient(135deg, #E8A23A 0%, #B96E12 100%);
    box-shadow: 0 4px 14px rgba(232,162,58,0.26);
}
.s-mship-status > * { position: relative; z-index: 1; }
.s-mship-status__top {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 14px;
}
.s-mship-status__badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: rgba(255,255,255,0.24);
    font-size: 12px; font-weight: 800;
    padding: 5px 10px 5px 8px;
    border-radius: 20px;
    letter-spacing: 0.02em;
}
.s-mship-status__plan {
    margin-left: auto;
    font-size: 12px; font-weight: 700;
    background: #fff; color: var(--violet);
    padding: 3px 9px; border-radius: 5px;
    letter-spacing: -0.01em;
}
.s-mship-status__title {
    font-size: 22px; font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.2;
    margin-bottom: 6px;
}
.s-mship-status__title em {
    font-style: normal;
    background: #fff; color: var(--violet);
    padding: 1px 8px; border-radius: 7px;
}
.s-mship-status--warn .s-mship-status__title em { color: #B96E12; }
.s-mship-status__date {
    font-size: 12.5px;
    opacity: 0.92;
    margin-bottom: 16px;
    font-weight: 600;
    letter-spacing: -0.01em;
}
.s-mship-status__quick {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 6px;
}
.s-mship-status__quick .qbtn {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    background: rgba(255,255,255,0.16);
    color: #fff;
    padding: 11px 4px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 11.5px; font-weight: 700;
    letter-spacing: -0.02em;
    border: 1px solid rgba(255,255,255,0.18);
}
.s-mship-status__quick .qbtn:hover { background: rgba(255,255,255,0.24); }
.s-mship-status__cta-group {
    display: flex; gap: 8px;
}
.s-mship-status--warn .s-mship-promo__cta-main { color: #B96E12; }

/* ===== 援먯쑁臾몄쓽 移대뱶 ===== */
.s-edu {
  position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 14px;
  margin: 0 20px 16px;
  padding: 18px 18px;
  border-radius: 16px;
  background: linear-gradient(135deg, #415270 0%, #2D3B55 100%);
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(65, 82, 112, 0.2);
}
.s-edu__deco {
  position: absolute; right: -40px; bottom: -40px;
  width: 160px; height: 160px;
  background: radial-gradient(circle, rgba(255, 215, 120, 0.18) 0%, rgba(255, 215, 120, 0) 60%);
  pointer-events: none;
}
.s-edu__ico {
  position: relative; z-index: 1;
  flex-shrink: 0;
  width: 44px; height: 44px; border-radius: 12px;
  background: rgba(255, 215, 120, 0.16);
  color: #FFD770;
  display: flex; align-items: center; justify-content: center;
}
.s-edu__body {
  position: relative; z-index: 1;
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 2px;
}
.s-edu__sub {
  font-size: 12px; font-weight: 600; color: rgba(255, 255, 255, 0.65);
  letter-spacing: 0.2px;
}
.s-edu__title {
  font-size: 18px; font-weight: 800; color: #fff;
  letter-spacing: -0.4px;
}
.s-edu__arr {
  position: relative; z-index: 1;
  flex-shrink: 0;
  width: 28px; height: 28px; border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #FFD770;
  display: flex; align-items: center; justify-content: center;
}
.s-edu:active { transform: translateY(1px); }

/* ===== 페이징 공통 ===== */
.paginate { display: flex; justify-content: center; padding: 16px 0 8px; }
.paginate .inner { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; }
.paginate .inner a { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 6px; border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--gray-500); text-decoration: none; white-space: nowrap; }
.paginate .inner a.curr { background: var(--violet); color: #fff; }
.paginate .inner a.link:hover { background: var(--gray-100); }
.paginate .inner a.first, .paginate .inner a.last { font-size: 11px; color: var(--gray-400); }
.paginate .inner a.prev::before { content: '‹'; font-size: 16px; }
.paginate .inner a.next::before { content: '›'; font-size: 16px; }
.paginate .inner a.prev, .paginate .inner a.next { font-size: 0; }
@media (max-width: 400px) {
  .paginate .inner { gap: 2px; }
  .paginate .inner a { min-width: 26px; height: 26px; font-size: 11px; padding: 0 3px; border-radius: 6px; }
  .paginate .inner a.first, .paginate .inner a.last { display: none; }
}