/* PC Trending page stylesheet: stuff.css */
/* =========================================================
   StuffView Premium Detail Restore V2 - 2026-08-18
   Scope every rule to .StuffDetailPage so the detail page
   cannot collide with list/offcanvas/recommend/ad layouts.
   ========================================================= */
.StuffDetailPage{
  --stuff-line:#e6ebf2;
  --stuff-soft:#f7f9fc;
  --stuff-soft-blue:#f3f7ff;
  --stuff-text:#182230;
  --stuff-sub:#69778c;
  --stuff-blue:#1668e8;
  --stuff-blue-dark:#0d56c7;
  width:100%;
  max-width:1180px;
  margin-left:auto;
  margin-right:auto;
  padding-top:26px;
  padding-bottom:52px;
  color:var(--stuff-text);
}

.StuffDetailPage > *{
  min-width:0;
}

.StuffDetailPage .StuffDetailBreadcrumb{
  margin-bottom:18px;
  font-size:.76rem;
}
.StuffDetailPage .StuffDetailBreadcrumb .breadcrumb{
  flex-wrap:nowrap;
  overflow:hidden;
}
.StuffDetailPage .StuffDetailBreadcrumb .breadcrumb-item{
  min-width:0;
  color:#8995a6;
}
.StuffDetailPage .StuffDetailBreadcrumb a{
  color:#748196;
  text-decoration:none;
}
.StuffDetailPage .StuffDetailBreadcrumb .active{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.StuffDetailPage .StuffDetailHeader{
  margin-bottom:18px;
}
.StuffDetailPage .StuffDetailHeaderMeta{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:9px;
}
.StuffDetailPage .StuffDetailTypeBadge{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:4px 9px;
  border:1px solid #dbe5f3;
  border-radius:999px;
  background:#f3f7fd;
  color:#41658f;
  font-size:.68rem;
  font-weight:800;
}
.StuffDetailPage .StuffDetailId{
  color:#9aa5b4;
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.09em;
}
.StuffDetailPage .StuffDetailHeader h1{
  margin:0;
  color:#182230;
  font-size:clamp(1.55rem,3vw,2.2rem);
  font-weight:900;
  line-height:1.28;
  letter-spacing:-.04em;
  word-break:keep-all;
}
.StuffDetailPage .StuffDetailHeader p{
  margin:9px 0 0;
  color:#7b8798;
  font-size:.84rem;
  line-height:1.65;
}

.StuffDetailPage .StuffDetailHero{
  overflow:hidden;
  margin:0 0 22px;
  border:1px solid var(--stuff-line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 14px 38px rgba(29,47,73,.07);
}
.StuffDetailPage .StuffDetailVisual{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:470px;
  padding:24px;
  border-right:1px solid var(--stuff-line);
  background:linear-gradient(145deg,#fbfcfe 0%,#f4f7fb 100%);
}
.StuffDetailPage .StuffDetailVisualTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.StuffDetailPage .StuffDetailVisualLabel,
.StuffDetailPage .StuffDetailEyebrow{
  color:#8b97a8;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.13em;
}
.StuffDetailPage .StuffDetailTrendPill{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:6px 9px;
  border:1px solid #cfe0ff;
  border-radius:999px;
  background:#edf4ff;
  color:#1464d8;
  font-size:.68rem;
  font-weight:850;
  white-space:nowrap;
}
.StuffDetailPage .StuffDetailImageWrap{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:1 1 auto;
  min-height:340px;
  padding:18px 8px 4px;
}
.StuffDetailPage .StuffDetailImage{
  display:block;
  width:100%;
  max-width:430px;
  max-height:360px;
  object-fit:contain;
  mix-blend-mode:multiply;
}
.StuffDetailPage .StuffDetailImageFallback{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:11px;
  width:100%;
  min-height:300px;
  color:#9ba7b7;
  font-size:.78rem;
}
.StuffDetailPage .StuffDetailImageFallback i{
  font-size:2.5rem;
}

.StuffDetailPage .StuffDetailDecisionPanel{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:470px;
  padding:30px;
  background:#fff;
}
.StuffDetailPage .StuffDetailDecisionHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding-bottom:22px;
  border-bottom:1px solid #edf0f4;
}
.StuffDetailPage .StuffDetailDecisionHead h2,
.StuffDetailPage .StuffDetailSectionHead h2,
.StuffDetailPage .StuffDetailLinkPanel h2{
  margin:7px 0 0;
  color:#172033;
  font-size:1.22rem;
  font-weight:900;
  letter-spacing:-.035em;
}
.StuffDetailPage .StuffDetailPrice{
  flex:0 0 auto;
  text-align:right;
}
.StuffDetailPage .StuffDetailPrice > span{
  display:block;
  margin-bottom:4px;
  color:#8d98a7;
  font-size:.7rem;
  font-weight:700;
}
.StuffDetailPage .StuffDetailPrice strong{
  display:block;
  color:#101828;
  font-size:1.65rem;
  font-weight:900;
  letter-spacing:-.045em;
  white-space:nowrap;
}
.StuffDetailPage .StuffDetailPrice em{
  margin-left:3px;
  color:#69778b;
  font-size:.78rem;
  font-style:normal;
  font-weight:800;
}

.StuffDetailPage .StuffDetailMetrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin-top:20px;
}
.StuffDetailPage .StuffDetailMetric{
  display:flex;
  align-items:flex-start;
  gap:10px;
  min-width:0;
  padding:14px;
  border:1px solid #e8edf3;
  border-radius:15px;
  background:#fafbfd;
}
.StuffDetailPage .StuffDetailMetricIcon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:10px;
  font-size:.88rem;
}
.StuffDetailPage .StuffDetailMetricIcon.is-trend{background:#eaf2ff;color:#1769e8;}
.StuffDetailPage .StuffDetailMetricIcon.is-price{background:#eaf8f0;color:#188653;}
.StuffDetailPage .StuffDetailMetricIcon.is-month{background:#f3efff;color:#7254cf;}
.StuffDetailPage .StuffDetailMetricLabel{
  display:block;
  overflow:hidden;
  margin-bottom:3px;
  color:#7c8899;
  font-size:.65rem;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.StuffDetailPage .StuffDetailMetric strong{
  display:block;
  color:#253143;
  font-size:.96rem;
  font-weight:900;
  white-space:nowrap;
}
.StuffDetailPage .StuffDetailMetric small{
  display:block;
  margin-top:3px;
  color:#97a1af;
  font-size:.61rem;
  line-height:1.35;
}
.StuffDetailPage .is-up-good,
.StuffDetailPage .is-price-good{color:#178255;}
.StuffDetailPage .is-down-bad,
.StuffDetailPage .is-price-bad{color:#dc4c5d;}
.StuffDetailPage .is-flat{color:#7e8a99;}

.StuffDetailPage .StuffDetailQuickSpec{
  margin-top:18px;
  padding:15px 16px;
  border:1px solid #e7ecf2;
  border-radius:14px;
  background:#f8fafc;
}
.StuffDetailPage .StuffDetailQuickSpecLabel{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:7px;
  color:#4e5d70;
  font-size:.72rem;
  font-weight:850;
}
.StuffDetailPage .StuffDetailQuickSpec p{
  display:-webkit-box;
  overflow:hidden;
  margin:0;
  color:#68768a;
  font-size:.75rem;
  line-height:1.6;
  word-break:keep-all;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
}

.StuffDetailPage .StuffDetailActions{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);
  gap:10px;
  margin-top:auto;
  padding-top:22px;
}
.StuffDetailPage .StuffDetailBuyBtn,
.StuffDetailPage .StuffDetailSubBtn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:48px;
  border-radius:13px;
  font-size:.78rem;
  font-weight:850;
}
.StuffDetailPage .StuffDetailBuyBtn{
  justify-content:space-between;
  border:1px solid #1266e8;
  background:linear-gradient(135deg,#1973f4,#125fd7);
  color:#fff;
  box-shadow:0 9px 18px rgba(23,105,227,.18);
}
.StuffDetailPage .StuffDetailBuyBtn:hover{color:#fff;background:#0f5dcd;}
.StuffDetailPage .StuffDetailSubBtn{
  border:1px solid #dde5ef;
  background:#fff;
  color:#4d5c70;
}
.StuffDetailPage .StuffDetailSubBtn:hover{
  border-color:#bfd0e6;
  background:#f8fafc;
  color:#1c5fb7;
}
.StuffDetailPage .StuffDetailPriceNotice{
  margin:9px 0 0;
  color:#9aa4b2;
  font-size:.62rem;
  text-align:right;
}

.StuffDetailPage .StuffDetailSection,
.StuffDetailPage .StuffDetailRelatedSection,
.StuffDetailPage .StuffDetailLinkPanel{
  margin:22px 0 0;
  padding:24px;
  border:1px solid var(--stuff-line);
  border-radius:20px;
  background:#fff;
  box-shadow:0 8px 24px rgba(29,47,73,.035);
}
.StuffDetailPage .StuffDetailSectionHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.StuffDetailPage .StuffDetailSectionHead p{
  margin:6px 0 0;
  color:#8b95a5;
  font-size:.73rem;
  line-height:1.55;
  word-break:keep-all;
}

.StuffDetailPage .StuffDetailChartSection{
  padding-bottom:20px;
}
.StuffDetailPage .GraphControlBtnArea{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.StuffDetailPage .GraphControlBtnArea .btn{
  min-width:58px;
  padding:6px 10px;
  border:1px solid #dfe6ee;
  border-radius:10px;
  background:#fff;
  color:#69778b;
  font-size:.68rem;
  font-weight:800;
}
.StuffDetailPage .GraphControlBtnArea .btn.active{
  border-color:#b9d1f5;
  background:#eef5ff;
  color:#1465db;
}
.StuffDetailPage .StuffGraphArea{
  overflow:hidden;
  width:100%;
  padding:10px 4px 0;
}
.StuffDetailPage .GraphViewArea{
  width:100%;
  min-height:360px;
}
.StuffDetailPage .GraphViewArea .GraphPanal{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:350px;
}
.StuffDetailPage .StuffChartLoading{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:300px;
  color:#8c98a8;
  font-size:.74rem;
}

.StuffDetailPage .StuffDetailAd{
  width:100% !important;
  margin:22px auto 0 !important;
  padding:10px 0;
  border:0 !important;
  background:transparent !important;
}
.StuffDetailPage .StuffDetailAd .PcAdStage{
  width:100% !important;
  max-width:100% !important;
}

.StuffDetailPage .StuffDetailAiSection{
  background:linear-gradient(145deg,#fbfdff,#f7faff);
}
.StuffDetailPage .StuffDetailAiHead h2 i{
  color:#3479e7;
}
.StuffDetailPage .StuffDetailAiContent{
  min-height:90px;
  padding:18px;
  border:1px solid #e1e9f4;
  border-radius:15px;
  background:#fff;
  color:#536176;
  font-size:.8rem;
  line-height:1.75;
  word-break:keep-all;
}
.StuffDetailPage .StuffDetailAiContent p:last-child{margin-bottom:0;}
.StuffDetailPage .StuffDetailAiNotice{
  display:flex;
  align-items:flex-start;
  gap:7px;
  margin-top:11px;
  color:#929dab;
  font-size:.64rem;
  line-height:1.5;
}

.StuffDetailPage .StuffDetailMediaAsync{
  margin-top:22px;
}
.StuffDetailPage .StuffDetailMediaAsync:empty{
  display:none;
}

.StuffDetailPage .StuffDiscriptionArea{
  position:relative;
  overflow:hidden;
  border:1px solid #e7ecf2;
  border-radius:16px;
  background:#fff;
}
.StuffDetailPage .StuffDiscriptionContent{
  overflow:hidden;
  width:100%;
  max-height:760px;
  padding:10px;
  transition:max-height .28s ease;
}
.StuffDetailPage .StuffDiscriptionContent img,
.StuffDetailPage .StuffDetailDescriptionContent img{
  display:block;
  max-width:100% !important;
  height:auto !important;
  margin-left:auto;
  margin-right:auto;
}
.StuffDetailPage .StuffDiscriptionContent table,
.StuffDetailPage .StuffDetailDescriptionContent table{
  display:block;
  overflow-x:auto;
  max-width:100% !important;
}
.StuffDetailPage .StuffDiscriptionContent iframe,
.StuffDetailPage .StuffDetailDescriptionContent iframe{
  max-width:100% !important;
}
.StuffDetailPage .ToggleDescriptionBtnArea{
  position:relative;
  z-index:2;
  margin-top:-58px;
  padding:76px 14px 14px;
  background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 50%);
}
.StuffDetailPage .ToggleDescriptionBtn{
  min-width:170px;
  border:1px solid #dce5ef;
  border-radius:11px;
  background:#fff;
  color:#58677b;
  font-size:.72rem;
  font-weight:800;
}
.StuffDetailPage .StuffDiscriptionArea.is-expanded .StuffDiscriptionContent,
.StuffDetailPage .StuffDiscriptionContent.is-expanded{
  max-height:none;
}
.StuffDetailPage .StuffDiscriptionArea.is-expanded .ToggleDescriptionBtnArea{
  margin-top:0;
  padding-top:10px;
  background:#fff;
}

.StuffDetailPage .StuffDetailRelatedSection{
  padding-bottom:10px;
}
.StuffDetailPage .StuffDetailRelatedBlock{
  margin-bottom:22px;
}
.StuffDetailPage .StuffDetailRelatedBlock + .StuffDetailRelatedBlock{
  padding-top:22px;
  border-top:1px solid #edf0f4;
}
.StuffDetailPage .StuffDetailRelatedCard{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  height:100%;
  border:1px solid #e7ecf2;
  border-radius:15px;
  background:#fff;
  color:inherit;
  text-decoration:none;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.StuffDetailPage .StuffDetailRelatedCard:hover{
  transform:translateY(-2px);
  border-color:#c9d7ea;
  box-shadow:0 8px 20px rgba(34,52,77,.07);
  color:inherit;
}
.StuffDetailPage .StuffDetailRelatedImage{
  display:flex;
  align-items:center;
  justify-content:center;
  aspect-ratio:1.32 / 1;
  padding:12px;
  background:#f8fafc;
  color:#9aa7b7;
  font-size:1.7rem;
}
.StuffDetailPage .StuffDetailRelatedImage img{
  width:100%;
  height:100%;
  object-fit:contain;
  mix-blend-mode:multiply;
}
.StuffDetailPage .StuffDetailRelatedBody{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-width:0;
  padding:12px;
}
.StuffDetailPage .StuffDetailRelatedType{
  margin-bottom:5px;
  color:#718097;
  font-size:.62rem;
  font-weight:800;
}
.StuffDetailPage .StuffDetailRelatedBody > strong{
  display:-webkit-box;
  overflow:hidden;
  min-height:2.8em;
  color:#273244;
  font-size:.75rem;
  line-height:1.4;
  word-break:keep-all;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.StuffDetailPage .StuffDetailRelatedBottom{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  margin-top:auto;
  padding-top:10px;
}
.StuffDetailPage .StuffDetailRelatedBottom b{
  color:#1d2939;
  font-size:.76rem;
  font-weight:900;
}
.StuffDetailPage .StuffDetailRelatedBottom span{
  color:#8c98a8;
  font-size:.6rem;
  text-align:right;
}

.StuffDetailPage .StuffDetailRisingContent{
  width:100%;
  min-width:0;
}
.StuffDetailPage .StuffDetailRisingContent .row{
  margin-left:0;
  margin-right:0;
}

.StuffDetailPage .StuffDetailLinkPanel{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:linear-gradient(145deg,#17233b,#223c69);
  color:#fff;
}
.StuffDetailPage .StuffDetailLinkPanel .StuffDetailEyebrow{
  color:#8eb9ff;
}
.StuffDetailPage .StuffDetailLinkPanel h2{
  color:#fff;
}
.StuffDetailPage .StuffDetailLinkList{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:8px;
}
.StuffDetailPage .StuffDetailLinkList a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:9px 11px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:10px;
  background:rgba(255,255,255,.07);
  color:#eef5ff;
  font-size:.68rem;
  font-weight:800;
  text-decoration:none;
}
.StuffDetailPage .StuffDetailLinkList a:hover{
  border-color:rgba(255,255,255,.28);
  background:rgba(255,255,255,.12);
  color:#fff;
}

.StuffDetailPage #ImageViewModal img{
  max-height:88vh;
  object-fit:contain;
}

/* Keep legacy/global card rules from leaking into the premium detail page. */
.StuffDetailPage .StuffDetailHero:hover,
.StuffDetailPage .StuffDetailSection:hover,
.StuffDetailPage .StuffDetailRelatedSection:hover{
  filter:none;
}

@media (max-width:991.98px){
  .StuffDetailPage{
    max-width:960px;
  }
  .StuffDetailPage .StuffDetailVisual{
    min-height:400px;
    border-right:0;
    border-bottom:1px solid var(--stuff-line);
  }
  .StuffDetailPage .StuffDetailDecisionPanel{
    min-height:0;
  }
  .StuffDetailPage .StuffDetailImageWrap{
    min-height:290px;
  }
  .StuffDetailPage .StuffDetailImage{
    max-height:310px;
  }
}

@media (max-width:767.98px){
  .StuffDetailPage{
    width:100%;
    max-width:none;
    padding-left:14px !important;
    padding-right:14px !important;
    padding-top:18px;
    padding-bottom:34px;
  }
  .StuffDetailPage .StuffDetailBreadcrumb{
    margin-bottom:13px;
    font-size:.68rem;
  }
  .StuffDetailPage .StuffDetailHeader{
    margin-bottom:14px;
  }
  .StuffDetailPage .StuffDetailHeaderMeta{
    margin-bottom:7px;
  }
  .StuffDetailPage .StuffDetailHeader h1{
    font-size:1.3rem;
    line-height:1.35;
  }
  .StuffDetailPage .StuffDetailHeader p{
    margin-top:7px;
    font-size:.72rem;
  }
  .StuffDetailPage .StuffDetailHero{
    margin-bottom:14px;
    border-radius:18px;
    box-shadow:0 7px 20px rgba(29,47,73,.055);
  }
  .StuffDetailPage .StuffDetailVisual{
    min-height:300px;
    padding:16px;
  }
  .StuffDetailPage .StuffDetailImageWrap{
    min-height:230px;
    padding-top:10px;
  }
  .StuffDetailPage .StuffDetailImage{
    max-height:245px;
  }
  .StuffDetailPage .StuffDetailDecisionPanel{
    padding:18px 16px;
  }
  .StuffDetailPage .StuffDetailDecisionHead{
    gap:10px;
    padding-bottom:16px;
  }
  .StuffDetailPage .StuffDetailDecisionHead h2{
    font-size:1rem;
  }
  .StuffDetailPage .StuffDetailPrice strong{
    font-size:1.25rem;
  }
  .StuffDetailPage .StuffDetailMetrics{
    grid-template-columns:1fr;
    gap:8px;
    margin-top:15px;
  }
  .StuffDetailPage .StuffDetailMetric{
    align-items:center;
    padding:11px 12px;
  }
  .StuffDetailPage .StuffDetailMetricLabel{
    white-space:normal;
  }
  .StuffDetailPage .StuffDetailQuickSpec{
    margin-top:13px;
    padding:12px;
  }
  .StuffDetailPage .StuffDetailActions{
    grid-template-columns:1fr;
    margin-top:3px;
    padding-top:16px;
  }
  .StuffDetailPage .StuffDetailBuyBtn,
  .StuffDetailPage .StuffDetailSubBtn{
    min-height:45px;
  }
  .StuffDetailPage .StuffDetailPriceNotice{
    text-align:left;
  }
  .StuffDetailPage .StuffDetailSection,
  .StuffDetailPage .StuffDetailRelatedSection,
  .StuffDetailPage .StuffDetailLinkPanel{
    margin-top:14px;
    padding:17px 15px;
    border-radius:17px;
  }
  .StuffDetailPage .StuffDetailSectionHead{
    flex-direction:column;
    gap:12px;
    margin-bottom:14px;
  }
  .StuffDetailPage .StuffDetailSectionHead h2,
  .StuffDetailPage .StuffDetailLinkPanel h2{
    font-size:1rem;
  }
  .StuffDetailPage .GraphControlBtnArea{
    width:100%;
    justify-content:flex-start;
  }
  .StuffDetailPage .GraphViewArea{
    min-height:270px;
  }
  .StuffDetailPage .GraphViewArea .GraphPanal{
    min-height:260px;
  }
  .StuffDetailPage .StuffChartLoading{
    min-height:230px;
  }
  .StuffDetailPage .StuffDetailAiContent{
    padding:14px;
    font-size:.74rem;
  }
  .StuffDetailPage .StuffDiscriptionContent{
    max-height:560px;
    padding:4px;
  }
  .StuffDetailPage .StuffDetailRelatedSection{
    padding-bottom:4px;
  }
  .StuffDetailPage .StuffDetailRelatedImage{
    padding:8px;
  }
  .StuffDetailPage .StuffDetailRelatedBody{
    padding:10px;
  }
  .StuffDetailPage .StuffDetailRelatedBody > strong{
    font-size:.7rem;
  }
  .StuffDetailPage .StuffDetailRelatedBottom{
    display:block;
  }
  .StuffDetailPage .StuffDetailRelatedBottom span{
    display:block;
    margin-top:3px;
    text-align:left;
  }
  .StuffDetailPage .StuffDetailLinkPanel{
    align-items:flex-start;
    flex-direction:column;
    gap:14px;
  }
  .StuffDetailPage .StuffDetailLinkList{
    width:100%;
    justify-content:flex-start;
  }
  .StuffDetailPage .StuffDetailLinkList a{
    flex:1 1 calc(50% - 4px);
    justify-content:space-between;
    min-width:0;
  }
  .StuffDetailPage .StuffDetailAd{
    margin-top:14px !important;
    padding:6px 0;
  }
}

@media (max-width:390px){
  .StuffDetailPage{
    padding-left:10px !important;
    padding-right:10px !important;
  }
  .StuffDetailPage .StuffDetailDecisionHead{
    flex-direction:column;
  }
  .StuffDetailPage .StuffDetailPrice{
    width:100%;
    text-align:left;
  }
  .StuffDetailPage .StuffDetailLinkList a{
    flex-basis:100%;
  }
}


/* =========================================================
   Stuff Detail Offcanvas V2 - 2026-08-18
   ========================================================= */
.RowStuffOffcanvas.StuffOffsetV2{
  --offset-ink:#172033;
  --offset-sub:#667085;
  --offset-line:#e8edf3;
  --offset-soft:#f7f9fc;
  --offset-blue:#3568f0;
  --offset-navy:#1f2b46;
}
.StuffOffsetV2 .StuffOffsetHero{
  padding:20px;
  margin-bottom:16px;
  background:linear-gradient(180deg,#fff 0%,#fbfcff 100%);
  border:1px solid var(--offset-line);
  border-radius:20px;
  box-shadow:0 10px 32px rgba(28,39,60,.07);
}
.StuffOffsetV2 .StuffOffsetMeta,
.StuffOffsetV2 .StuffOffsetMetaLeft,
.StuffOffsetV2 .StuffOffsetSectionHead,
.StuffOffsetV2 .StuffOffsetStickyActions{
  display:flex;
  align-items:center;
}
.StuffOffsetV2 .StuffOffsetMeta{justify-content:space-between;gap:12px;margin-bottom:9px;}
.StuffOffsetV2 .StuffOffsetMetaLeft{gap:8px;min-width:0;}
.StuffOffsetV2 .StuffOffsetTypeBadge{
  display:inline-flex;align-items:center;min-height:25px;padding:4px 9px;border-radius:8px;
  background:#edf3ff;color:#315fce;font-size:.72rem;font-weight:800;white-space:nowrap;
}
.StuffOffsetV2 .StuffOffsetProductNo{color:#98a2b3;font-size:.69rem;font-weight:700;letter-spacing:.035em;white-space:nowrap;}
.StuffOffsetV2 .StuffOffsetDetailLink{color:#667085;font-size:.75rem;font-weight:700;text-decoration:none;white-space:nowrap;}
.StuffOffsetV2 .StuffOffsetDetailLink:hover{color:var(--offset-blue);}
.StuffOffsetV2 .StuffOffsetName{
  margin:0 0 18px;color:var(--offset-ink);font-size:1.3rem;font-weight:850;line-height:1.42;letter-spacing:-.04em;word-break:keep-all;
}
.StuffOffsetV2 .StuffOffsetHeroGrid{display:grid;grid-template-columns:minmax(0,46%) minmax(0,54%);border:1px solid var(--offset-line);border-radius:16px;overflow:hidden;background:#fff;}
.StuffOffsetV2 .StuffOffsetVisual{display:flex;align-items:center;justify-content:center;min-height:260px;background:linear-gradient(145deg,#f8fafc,#fff);border-right:1px solid var(--offset-line);}
.StuffOffsetV2 .StuffOffsetImageStage{width:100%;height:100%;min-height:260px;padding:22px;display:flex;align-items:center;justify-content:center;}
.StuffOffsetV2 .StuffHeroImage{width:100%;max-width:330px;max-height:245px;object-fit:contain;filter:drop-shadow(0 9px 17px rgba(31,43,70,.09));}
.StuffOffsetV2 .StuffOffsetImageFallback{display:flex;flex-direction:column;align-items:center;gap:8px;color:#98a2b3;font-size:.78rem;}
.StuffOffsetV2 .StuffOffsetImageFallback i{font-size:2.2rem;}
.StuffOffsetV2 .StuffOffsetDecision{padding:22px;display:flex;flex-direction:column;justify-content:center;}
.StuffOffsetV2 .StuffOffsetEyebrow{display:block;margin-bottom:4px;color:#8b95a7;font-size:.64rem;font-weight:850;letter-spacing:.12em;}
.StuffOffsetV2 .StuffOffsetPriceLabel{margin-top:3px;color:#667085;font-size:.76rem;font-weight:700;}
.StuffOffsetV2 .StuffPrice{margin:2px 0 13px;color:#ef3b4e;font-size:1.7rem;font-weight:900;letter-spacing:-.045em;}
.StuffOffsetV2 .StuffPrice em{margin-left:2px;font-size:.78rem;font-style:normal;font-weight:800;}
.StuffOffsetV2 .StuffOffsetSignal{display:flex;gap:10px;padding:11px 12px;margin-bottom:13px;border-radius:12px;background:#f6f8fb;border:1px solid #edf0f4;}
.StuffOffsetV2 .StuffOffsetSignalIcon{width:32px;height:32px;flex:0 0 32px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#fff;color:#667085;box-shadow:0 2px 7px rgba(31,43,70,.06);}
.StuffOffsetV2 .StuffOffsetSignal strong{display:block;color:#344054;font-size:.78rem;line-height:1.35;}
.StuffOffsetV2 .StuffOffsetSignal span:not(.StuffOffsetSignalIcon){display:block;margin-top:2px;color:#7b8494;font-size:.68rem;line-height:1.45;word-break:keep-all;}
.StuffOffsetV2 .StuffOffsetSignal.is-good{background:#f1fbf6;border-color:#d7f2e3}.StuffOffsetV2 .StuffOffsetSignal.is-good .StuffOffsetSignalIcon{color:#18a66a}
.StuffOffsetV2 .StuffOffsetSignal.is-warn{background:#fff8f2;border-color:#f9e4d1}.StuffOffsetV2 .StuffOffsetSignal.is-warn .StuffOffsetSignalIcon{color:#e6782c}
.StuffOffsetV2 .StuffOffsetSignal.is-hot{background:#f6f2ff;border-color:#e7dcff}.StuffOffsetV2 .StuffOffsetSignal.is-hot .StuffOffsetSignalIcon{color:#7757d8}
.StuffOffsetV2 .StuffOffsetBuyBtn{width:100%;min-height:44px;padding:10px 14px;border:0;border-radius:12px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#2f63e9,#426ff2);color:#fff;font-size:.82rem;font-weight:800;box-shadow:0 8px 18px rgba(53,104,240,.18);}
.StuffOffsetV2 .StuffOffsetBuyBtn:hover{color:#fff;transform:translateY(-1px);}
.StuffOffsetV2 .StuffOffsetMetrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px;}
.StuffOffsetV2 .StuffOffsetMetric{display:flex;align-items:center;gap:9px;padding:12px;background:#fff;border:1px solid var(--offset-line);border-radius:13px;min-width:0;}
.StuffOffsetV2 .StuffOffsetMetricIcon{width:34px;height:34px;flex:0 0 34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#eef3ff;color:#3c6bef;}
.StuffOffsetV2 .StuffOffsetMetricIcon.is-week{background:#eefaf4;color:#1c9a61}.StuffOffsetV2 .StuffOffsetMetricIcon.is-month{background:#fff5ec;color:#dd7b2a}
.StuffOffsetV2 .StuffOffsetMetric>div{min-width:0}.StuffOffsetV2 .StuffOffsetMetric span:not(.StuffOffsetMetricIcon){display:block;color:#7c8799;font-size:.64rem;font-weight:700;white-space:nowrap;}
.StuffOffsetV2 .StuffOffsetMetric strong{display:block;margin-top:1px;color:#273142;font-size:.95rem;line-height:1.25;white-space:nowrap;}
.StuffOffsetV2 .StuffOffsetMetric small{display:block;margin-top:2px;color:#98a2b3;font-size:.59rem;white-space:nowrap;}
.StuffOffsetV2 .StuffOffsetMetric .is-up{color:#2e6be6}.StuffOffsetV2 .StuffOffsetMetric .is-down{color:#818b9d}.StuffOffsetV2 .is-price-good{color:#17915b!important}.StuffOffsetV2 .is-price-bad{color:#e34a4a!important}
.StuffOffsetV2 .StuffOffsetQuickSpec{margin-top:12px;padding:13px 14px;border-radius:13px;background:#f7f9fc;border:1px solid #edf0f4;}
.StuffOffsetV2 .StuffOffsetQuickSpec>span{display:block;margin-bottom:5px;color:#475467;font-size:.72rem;font-weight:800;}.StuffOffsetV2 .StuffOffsetQuickSpec i{color:#3568f0;}
.StuffOffsetV2 .StuffOffsetQuickSpec p{margin:0;color:#667085;font-size:.72rem;line-height:1.65;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;word-break:keep-all;}
.StuffOffsetV2 .StuffSection{border-radius:16px!important;border-color:var(--offset-line);box-shadow:0 6px 20px rgba(28,39,60,.045)!important;}
.StuffOffsetV2 .StuffOffsetSectionHead{justify-content:space-between;gap:12px;}.StuffOffsetV2 .StuffOffsetSectionHead p{margin:3px 0 0;color:#8a94a5;font-size:.67rem;line-height:1.4;}
.StuffOffsetV2 .StuffOffsetGraphControls{display:flex;gap:6px;flex:0 0 auto;}.StuffOffsetV2 .StuffOffsetGraphControls .btn{padding:5px 10px;border-radius:9px;background:#f3f5f8;color:#697386;font-size:.7rem;font-weight:800;}.StuffOffsetV2 .StuffOffsetGraphControls .btn.active{background:#eaf0ff;color:#3568f0;}
.StuffOffsetV2 .StuffOffsetChartLoading{min-height:210px;display:flex;flex-direction:column;gap:9px;align-items:center;justify-content:center;color:#98a2b3;font-size:.72rem;}
.StuffOffsetV2 .StuffAiArea{background:linear-gradient(145deg,#f8faff,#fff);border-color:#e2e9f7;}.StuffOffsetV2 .StuffAiArea .StuffSectionTitle i{color:#5f72d8;}.StuffOffsetV2 .StuffOffsetAiNotice{margin-top:10px;padding-top:9px;border-top:1px solid #e8edf6;color:#98a2b3;font-size:.63rem;}
.StuffOffsetV2 .StuffStickyBuy{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-left:-18px;margin-right:-18px;}.StuffOffsetV2 .StuffOffsetStickyInfo{min-width:0;}.StuffOffsetV2 .StuffOffsetStickyInfo span{display:block;color:#8a94a5;font-size:.64rem;}.StuffOffsetV2 .StuffOffsetStickyInfo strong{display:block;color:#ef3b4e;font-size:1.05rem;white-space:nowrap;}.StuffOffsetV2 .StuffOffsetStickyActions{gap:7px;}.StuffOffsetV2 .StuffOffsetStickyActions .btn{min-width:auto!important;border-radius:10px;font-size:.75rem;font-weight:800;}.StuffOffsetV2 .StuffOffsetStickyDetail{background:#f1f4f8;color:#536071;}.StuffOffsetV2 .StuffOffsetStickyBuy{background:#3568f0;color:#fff;}
.StuffOffsetV2 .StuffOffsetEmpty,.StuffOffsetEmpty{padding:50px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;color:#7c8799}.StuffOffsetEmptyIcon{width:48px;height:48px;margin-bottom:12px;border-radius:15px;background:#f3f5f8;display:flex;align-items:center;justify-content:center;font-size:1.3rem}.StuffOffsetEmpty strong{color:#344054;font-size:.9rem}.StuffOffsetEmpty>span:last-child{margin-top:4px;font-size:.72rem}

@media(max-width:767.98px){
  .StuffOffsetV2 .StuffOffsetHero{padding:14px;border-radius:15px;}
  .StuffOffsetV2 .StuffOffsetMeta{align-items:flex-start}.StuffOffsetV2 .StuffOffsetMetaLeft{flex-wrap:wrap;gap:5px}.StuffOffsetV2 .StuffOffsetDetailLink{font-size:.68rem}
  .StuffOffsetV2 .StuffOffsetName{font-size:1.05rem;margin-bottom:13px;}
  .StuffOffsetV2 .StuffOffsetHeroGrid{grid-template-columns:1fr;}.StuffOffsetV2 .StuffOffsetVisual{min-height:185px;border-right:0;border-bottom:1px solid var(--offset-line);}.StuffOffsetV2 .StuffOffsetImageStage{min-height:185px;padding:14px}.StuffOffsetV2 .StuffHeroImage{max-height:175px}.StuffOffsetV2 .StuffOffsetDecision{padding:15px}.StuffOffsetV2 .StuffPrice{font-size:1.45rem;margin-bottom:10px}
  .StuffOffsetV2 .StuffOffsetMetrics{grid-template-columns:1fr 1fr;gap:7px}.StuffOffsetV2 .StuffOffsetMetric:first-child{grid-column:1/-1}.StuffOffsetV2 .StuffOffsetMetric{padding:10px}.StuffOffsetV2 .StuffOffsetMetric:first-child>div{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center}.StuffOffsetV2 .StuffOffsetMetric:first-child small{grid-column:1/-1}
  .StuffOffsetV2 .StuffOffsetQuickSpec{padding:11px 12px}.StuffOffsetV2 .StuffOffsetQuickSpec p{-webkit-line-clamp:4;font-size:.69rem}
  .StuffOffsetV2 .StuffOffsetSectionHead{align-items:flex-start}.StuffOffsetV2 .StuffOffsetSectionHead p{display:none}.StuffOffsetV2 .StuffOffsetGraphControls .btn{padding:5px 8px}
  .StuffOffsetV2 .StuffStickyBuy{margin-left:-12px;margin-right:-12px}.StuffOffsetV2 .StuffOffsetStickyDetail{display:none}.StuffOffsetV2 .StuffOffsetStickyActions{margin-left:auto}
}

/* =========================================================
   Stuff detail offcanvas V3 - compact + DB data normalization
   2026-08-18
========================================================= */
.StuffOffsetV2{--offset-compact-gap:10px;padding-bottom:8px!important;}
.StuffOffsetV2 .StuffOffsetHero{padding:14px!important;margin-bottom:10px!important;}
.StuffOffsetV2 .StuffOffsetMeta{margin-bottom:6px!important;}
.StuffOffsetV2 .StuffOffsetName{margin-bottom:10px!important;font-size:1.08rem!important;line-height:1.38!important;}
.StuffOffsetV2 .StuffOffsetHeroGrid{border-radius:14px!important;}
.StuffOffsetV2 .StuffOffsetVisual{min-height:215px!important;}
.StuffOffsetV2 .StuffOffsetImageStage{min-height:215px!important;padding:14px!important;}
.StuffOffsetV2 .StuffHeroImage{max-height:205px!important;}
.StuffOffsetV2 .StuffOffsetDecision{padding:15px!important;}
.StuffOffsetV2 .StuffPrice{margin:0 0 8px!important;font-size:1.58rem!important;}
.StuffOffsetV2 .StuffOffsetSignal{padding:9px 10px!important;margin-bottom:9px!important;gap:8px!important;}
.StuffOffsetV2 .StuffOffsetSignalIcon{width:29px!important;height:29px!important;flex-basis:29px!important;}
.StuffOffsetV2 .StuffOffsetBuyBtn{min-height:40px!important;padding:8px 12px!important;}
.StuffOffsetV2 .StuffOffsetMetrics{gap:7px!important;margin-top:8px!important;}
.StuffOffsetV2 .StuffOffsetMetric{gap:7px!important;padding:9px 10px!important;border-radius:11px!important;}
.StuffOffsetV2 .StuffOffsetMetricIcon{width:30px!important;height:30px!important;flex-basis:30px!important;border-radius:9px!important;}
.StuffOffsetV2 .StuffOffsetQuickSpec{margin-top:8px!important;padding:10px 11px!important;border-radius:11px!important;}
.StuffOffsetV2 .StuffOffsetQuickSpecHead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px;}
.StuffOffsetV2 .StuffOffsetQuickSpecHead>span{color:#475467;font-size:.72rem;font-weight:850;}
.StuffOffsetV2 .StuffOffsetQuickSpecHead>span i{color:#3568f0;margin-right:3px;}
.StuffOffsetV2 .StuffOffsetQuickSpecHead small{color:#a0a8b5;font-size:.6rem;font-weight:700;white-space:nowrap;}
.StuffOffsetV2 .StuffOffsetSpecGrid{display:flex;flex-wrap:wrap;gap:5px;}
.StuffOffsetV2 .StuffOffsetSpecChip{max-width:100%;padding:5px 8px;border:1px solid #e7ebf1;border-radius:8px;background:#fff;color:#5f6979;font-size:.66rem;font-weight:650;line-height:1.35;word-break:keep-all;}
.StuffOffsetV2 .StuffOffsetQuickSpec.is-text p{margin:0;color:#667085;font-size:.7rem;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.StuffOffsetV2 .StuffOffsetDataBasis{display:flex;align-items:center;gap:5px;margin:6px 2px 0;color:#9aa3b1;font-size:.59rem;line-height:1.35;}
.StuffOffsetV2 .StuffOffsetDataBasis i{color:#6f80a0;}
.StuffOffsetV2 .StuffSection{border-radius:13px!important;margin-bottom:10px!important;}
.StuffOffsetV2 .StuffSection.p-3{padding:12px!important;}
.StuffOffsetV2 .StuffOffsetRising{margin-bottom:10px!important;}
.StuffOffsetV2 .StuffOffsetSectionHead{gap:8px!important;}
.StuffOffsetV2 .StuffOffsetSectionHead p{margin-top:2px!important;}
.StuffOffsetV2 .GraphViewArea{padding-top:2px!important;padding-bottom:2px!important;}
.StuffOffsetV2 .StuffOffsetChartLoading{min-height:180px!important;}
.StuffOffsetV2 .StuffOffsetAiNotice{margin-top:7px!important;padding-top:7px!important;}
.StuffOffsetV2 .StuffDetailAd{margin-bottom:10px!important;padding:10px!important;}
.StuffOffsetV2 .StuffStickyBuy{padding-top:8px!important;padding-bottom:8px!important;}

@media (max-width: 767.98px){
  .StuffOffsetV2 .StuffOffsetHero{padding:11px!important;}
  .StuffOffsetV2 .StuffOffsetName{font-size:1rem!important;margin-bottom:8px!important;}
  .StuffOffsetV2 .StuffOffsetVisual{min-height:155px!important;}
  .StuffOffsetV2 .StuffOffsetImageStage{min-height:155px!important;padding:9px!important;}
  .StuffOffsetV2 .StuffHeroImage{max-height:145px!important;}
  .StuffOffsetV2 .StuffOffsetDecision{padding:11px!important;}
  .StuffOffsetV2 .StuffOffsetSignal{margin-bottom:8px!important;}
  .StuffOffsetV2 .StuffOffsetMetrics{gap:5px!important;margin-top:6px!important;}
  .StuffOffsetV2 .StuffOffsetMetric{padding:8px!important;}
  .StuffOffsetV2 .StuffOffsetQuickSpec{padding:9px!important;}
  .StuffOffsetV2 .StuffOffsetSpecGrid{gap:4px;}
  .StuffOffsetV2 .StuffOffsetSpecChip{padding:4px 7px;font-size:.63rem;}
  .StuffOffsetV2 .StuffSection.p-3{padding:10px!important;}
  .StuffOffsetV2 .StuffOffsetChartLoading{min-height:155px!important;}
}

/* =========================================================
   Stuff detail image isolation V4 - 2026-08-18
   DB 상세 이미지와 Google/API 미디어 영역 완전 분리
========================================================= */
.StuffOffsetV2 .StuffDiscriptionContent,
.StuffDetailPage .StuffDetailDescriptionContent{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  max-width:100%;
}
.StuffOffsetV2 .StuffDiscriptionContent img.StuffDbDetailImage,
.StuffDetailPage .StuffDetailDescriptionContent img.StuffDbDetailImage{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  margin:0 auto!important;
  object-fit:contain!important;
  position:static!important;
  float:none!important;
  transform:none!important;
}
.StuffOffsetV2 .StuffDiscriptionContent img.StuffDbDetailImage + img.StuffDbDetailImage,
.StuffDetailPage .StuffDetailDescriptionContent img.StuffDbDetailImage + img.StuffDbDetailImage{
  margin-top:0!important;
}
.StuffOffsetV2 .StuffMediaArea{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.StuffOffsetV2 .StuffMediaArea .ViewImgRow img,
.StuffOffsetV2 .StuffMediaArea .ViewVideoRow img{
  position:static!important;
  float:none!important;
}


/* =========================================================
   Stuff detail offcanvas V5 - full UX polish
   2026-08-19
========================================================= */
.StuffInfoCanvas{
  --sic-blue:#3568f0;
  --sic-ink:#172033;
  --sic-sub:#667085;
  --sic-line:#e8edf3;
  --sic-soft:#f7f9fc;
  background:#f7f9fc;
  border-left:1px solid #e4e9f0;
  box-shadow:-20px 0 55px rgba(24,34,52,.12);
}
.StuffInfoCanvas .StuffInfoCanvasHeader{
  position:sticky;
  top:0;
  z-index:40;
  min-height:70px;
  padding:13px 18px!important;
  display:flex;
  align-items:center;
  gap:14px;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--sic-line)!important;
  box-shadow:0 4px 16px rgba(25,36,54,.035);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.StuffInfoCanvasHeading{min-width:0;flex:1;}
.StuffInfoCanvasKicker{
  display:flex;
  align-items:center;
  gap:5px;
  margin-bottom:2px;
  color:#7b8798;
  font-size:.58rem;
  font-weight:850;
  letter-spacing:.12em;
}
.StuffInfoCanvasKicker i{color:var(--sic-blue);font-size:.68rem;}
.StuffInfoCanvas #stuffinfoTitle{
  width:100%;
  margin:0;
  overflow:hidden;
  color:var(--sic-ink);
  font-size:.98rem!important;
  font-weight:850!important;
  line-height:1.35;
  letter-spacing:-.025em;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.StuffInfoCanvasClose{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border:1px solid #e5eaf0;
  border-radius:12px;
  background:#fff;
  color:#596579;
  font-size:1rem;
  transition:background .15s ease,border-color .15s ease,color .15s ease,transform .15s ease;
}
.StuffInfoCanvasClose:hover{background:#f1f4f8;border-color:#dce3eb;color:#243047;transform:translateY(-1px);}
.StuffInfoCanvas .offcanvas-body{
  position:relative;
  padding:14px 18px 0!important;
  background:linear-gradient(180deg,#f8fafc 0,#f7f9fc 100%);
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.StuffInfoCanvas .offcanvas-body::-webkit-scrollbar{width:8px;}
.StuffInfoCanvas .offcanvas-body::-webkit-scrollbar-thumb{background:#d8dee7;border:2px solid #f7f9fc;border-radius:999px;}
.StuffInfoCanvas .offcanvas-body::-webkit-scrollbar-track{background:transparent;}

.StuffInfoCanvasLoading{max-width:760px;margin:12px auto;padding:18px;border:1px solid #e7ebf1;border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(31,43,70,.05);}
.StuffInfoCanvasLoadingVisual,.StuffInfoCanvasLoadingLine,.StuffInfoCanvasLoadingGrid span{position:relative;overflow:hidden;background:#edf1f6;}
.StuffInfoCanvasLoadingVisual::after,.StuffInfoCanvasLoadingLine::after,.StuffInfoCanvasLoadingGrid span::after{content:'';position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);animation:StuffInfoShimmer 1.35s infinite;}
.StuffInfoCanvasLoadingVisual{height:210px;border-radius:14px;margin-bottom:16px;}
.StuffInfoCanvasLoadingLine{height:11px;width:58%;border-radius:99px;margin:8px 0;}
.StuffInfoCanvasLoadingLine.is-lg{height:16px;width:78%;}
.StuffInfoCanvasLoadingGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px;}
.StuffInfoCanvasLoadingGrid span{height:58px;border-radius:11px;}
.StuffInfoCanvasLoadingText{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:18px;color:#8b95a5;font-size:.7rem;font-weight:700;}
@keyframes StuffInfoShimmer{100%{transform:translateX(100%);}}
.StuffInfoCanvasError{min-height:55vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 18px;text-align:center;color:#7b8798;}
.StuffInfoCanvasErrorIcon{width:52px;height:52px;margin-bottom:12px;display:flex;align-items:center;justify-content:center;border-radius:16px;background:#fff3f1;color:#df5a4f;font-size:1.25rem;}
.StuffInfoCanvasError strong{color:#344054;font-size:.92rem;}
.StuffInfoCanvasError p{margin:5px 0 16px;font-size:.72rem;}

.StuffOffsetV2 .StuffOffsetQuickNav{
  position:sticky;
  top:0;
  z-index:28;
  display:flex;
  gap:5px;
  margin:0 0 10px;
  padding:7px;
  overflow-x:auto;
  border:1px solid #e5eaf0;
  border-radius:13px;
  background:rgba(255,255,255,.96);
  box-shadow:0 6px 20px rgba(31,43,70,.055);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  scrollbar-width:none;
}
.StuffOffsetV2 .StuffOffsetQuickNav::-webkit-scrollbar{display:none;}
.StuffOffsetV2 .StuffOffsetNavItem{
  min-width:70px;
  min-height:38px;
  padding:6px 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#707b8d;
  font-size:.69rem;
  font-weight:800;
  white-space:nowrap;
  transition:background .15s ease,color .15s ease,box-shadow .15s ease;
}
.StuffOffsetV2 .StuffOffsetNavItem i{font-size:.78rem;}
.StuffOffsetV2 .StuffOffsetNavItem:hover{background:#f3f6fb;color:#40506a;}
.StuffOffsetV2 .StuffOffsetNavItem.is-active{background:#edf3ff;color:#315fce;box-shadow:inset 0 0 0 1px #dce7ff;}
.StuffOffsetV2 .StuffOffsetAnchorSection,#StuffOffsetSummary{scroll-margin-top:72px;}

.StuffOffsetV2 .StuffOffsetHero{background:#fff!important;box-shadow:0 8px 26px rgba(31,43,70,.055)!important;}
.StuffOffsetV2 .StuffOffsetHeroGrid{box-shadow:inset 0 0 0 1px rgba(255,255,255,.45);}
.StuffOffsetV2 .StuffOffsetName{max-width:95%;}
.StuffOffsetV2 .StuffOffsetDetailLink{display:inline-flex;align-items:center;gap:4px;padding:5px 8px;border-radius:8px;background:#f7f9fc;}
.StuffOffsetV2 .StuffOffsetDetailLink:hover{background:#edf3ff;}
.StuffOffsetV2 .StuffOffsetSignal strong{font-weight:850;}
.StuffOffsetV2 .StuffOffsetMetric{transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease;}
.StuffOffsetV2 .StuffOffsetMetric:hover{transform:translateY(-1px);border-color:#dce4ee;box-shadow:0 5px 14px rgba(31,43,70,.045);}
.StuffOffsetV2 .StuffOffsetSpecChip{cursor:default;}
.StuffOffsetV2 .StuffSection{background:#fff;border:1px solid #e7ebf1!important;box-shadow:0 7px 22px rgba(31,43,70,.045)!important;}
.StuffOffsetV2 .StuffOffsetSectionHead{min-height:32px;}
.StuffOffsetV2 .StuffSectionTitle{color:#263247;font-weight:850;letter-spacing:-.025em;}
.StuffOffsetV2 .StuffOffsetSectionBadge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:8px;background:#f4f6f9;color:#758095;font-size:.62rem;font-weight:800;white-space:nowrap;}
.StuffOffsetV2 .StuffGraphArea .GraphViewArea{margin-top:8px;padding:8px 4px 0!important;border-top:1px solid #f0f2f5;}
.StuffOffsetV2 .StuffAiArea{position:relative;overflow:hidden;}
.StuffOffsetV2 .StuffAiArea::before{content:'';position:absolute;top:-50px;right:-55px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(92,112,220,.1),rgba(92,112,220,0) 70%);pointer-events:none;}
.StuffOffsetV2 .AiAskInfoArea{position:relative;color:#4d596b!important;font-size:.76rem;line-height:1.72!important;}
.StuffOffsetV2 .StuffMediaArea{background:#fff;}
.StuffOffsetV2 .StuffDetailAd{border-radius:13px!important;background:#fff!important;border-color:#e7ebf1!important;}
.StuffOffsetV2 .ToggleDescriptionBtnArea{position:relative;z-index:2;padding:4px 0;}
.StuffOffsetV2 .ToggleDescriptionBtn{min-width:118px;border:1px solid #e2e7ee!important;background:#fff!important;color:#536071!important;box-shadow:0 3px 10px rgba(31,43,70,.06)!important;font-size:.72rem;font-weight:800;}
.StuffOffsetV2 .ToggleDescriptionBtn:hover{background:#f6f8fb!important;color:#315fce!important;}

.StuffOffsetV2 .StuffStickyBuy{
  z-index:35!important;
  min-height:64px;
  margin:0 -18px!important;
  padding:9px 18px calc(9px + env(safe-area-inset-bottom,0px))!important;
  border-top:1px solid #dfe5ec!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 -8px 24px rgba(28,39,60,.08)!important;
}
.StuffOffsetV2 .StuffOffsetStickyInfo span{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.StuffOffsetV2 .StuffOffsetStickyInfo strong{font-size:1rem!important;letter-spacing:-.025em;}
.StuffOffsetV2 .StuffOffsetStickyActions .btn{min-height:40px!important;padding:8px 13px!important;display:inline-flex!important;align-items:center!important;gap:5px!important;}
.StuffOffsetV2 .StuffOffsetStickyDetail{border:1px solid #e4e9ef;background:#f6f8fb!important;color:#536071!important;}
.StuffOffsetV2 a.StuffOffsetStickyBuy{background:linear-gradient(135deg,#2f63e9,#426ff2)!important;color:#fff!important;box-shadow:0 6px 14px rgba(53,104,240,.18);}

@media (min-width:992px){
  .offcanvas.custom-offcanvas.StuffInfoCanvas{width:min(760px,64vw)!important;}
}
@media (min-width:1600px){
  .offcanvas.custom-offcanvas.StuffInfoCanvas{width:min(820px,52vw)!important;}
}
@media (max-width:767.98px){
  .StuffInfoCanvas .StuffInfoCanvasHeader{min-height:62px;padding:10px 12px!important;}
  .StuffInfoCanvasKicker{font-size:.54rem;}
  .StuffInfoCanvas #stuffinfoTitle{font-size:.9rem!important;}
  .StuffInfoCanvasClose{width:36px;height:36px;flex-basis:36px;border-radius:11px;}
  .StuffInfoCanvas .offcanvas-body{padding:9px 10px 0!important;}
  .StuffInfoCanvasLoading{margin:6px auto;padding:12px;border-radius:14px;}
  .StuffInfoCanvasLoadingVisual{height:155px;}
  .StuffInfoCanvasLoadingGrid{gap:5px;}
  .StuffInfoCanvasLoadingGrid span{height:48px;}
  .StuffOffsetV2 .StuffOffsetQuickNav{margin-bottom:8px;padding:5px;border-radius:11px;}
  .StuffOffsetV2 .StuffOffsetNavItem{min-width:60px;min-height:35px;padding:5px 8px;font-size:.64rem;gap:4px;}
  .StuffOffsetV2 .StuffOffsetNavItem i{font-size:.72rem;}
  .StuffOffsetV2 .StuffOffsetName{max-width:100%;}
  .StuffOffsetV2 .StuffOffsetDetailLink{padding:4px 6px;}
  .StuffOffsetV2 .StuffOffsetSectionBadge{padding:4px 6px;font-size:.58rem;}
  .StuffOffsetV2 .StuffStickyBuy{margin:0 -10px!important;padding-left:10px!important;padding-right:10px!important;}
  .StuffOffsetV2 .StuffOffsetStickyInfo span{max-width:120px;}
  .StuffOffsetV2 .StuffOffsetStickyActions .btn{padding:8px 11px!important;}
  .StuffOffsetV2 .StuffOffsetStickyActions .btn span{display:inline;}
}
@media (max-width:420px){
  .StuffOffsetV2 .StuffOffsetStickyInfo{max-width:42%;}
  .StuffOffsetV2 .StuffOffsetStickyInfo strong{font-size:.9rem!important;}
  .StuffOffsetV2 .StuffOffsetStickyActions{gap:5px!important;}
  .StuffOffsetV2 .StuffOffsetStickyActions .btn{padding:8px 10px!important;font-size:.7rem!important;}
  .StuffOffsetV2 .StuffOffsetStickyDetail span{display:none;}
}

/* PC TRENDING - Stuff offset detail collapse helper V1 */
.StuffInfoCanvas .StuffOffsetDetailFloat{
  position:absolute;
  right:18px;
  bottom:82px;
  z-index:60;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:42px;
  padding:9px 14px;
  border:1px solid #dbe4f2;
  border-radius:999px;
  background:rgba(255,255,255,.97);
  color:#315fce;
  box-shadow:0 8px 24px rgba(31,43,70,.16);
  font-size:.72rem;
  font-weight:850;
  line-height:1;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(10px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease,background .15s ease,border-color .15s ease;
}
.StuffInfoCanvas .StuffOffsetDetailFloat.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.StuffInfoCanvas .StuffOffsetDetailFloat:hover{
  background:#f3f7ff;
  border-color:#cbdaf8;
  color:#244eaf;
}
.StuffInfoCanvas .StuffOffsetDetailFloat i{font-size:.84rem;}
.StuffOffsetV2 .StuffDiscriptionContent.expanded{
  padding-bottom:8px;
}
@media (max-width:767.98px){
  .StuffInfoCanvas .StuffOffsetDetailFloat{
    right:12px;
    bottom:78px;
    min-height:40px;
    padding:8px 12px;
    font-size:.68rem;
    box-shadow:0 7px 20px rgba(31,43,70,.15);
  }
}
@media (max-width:420px){
  .StuffInfoCanvas .StuffOffsetDetailFloat{
    right:10px;
    bottom:74px;
  }
  .StuffInfoCanvas .StuffOffsetDetailFloat span{display:inline;}
}

/* =========================================================
 * Stuff market signal readability V1 - 2026-08-19
 * ========================================================= */
.MarketSignalCard{
  border:1px solid #e4eaf3;
  border-radius:16px;
  background:#fff;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(29,41,57,.06);
}
.MarketSignalHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:15px 16px 12px;
  border-bottom:1px solid #eef2f7;
  background:linear-gradient(135deg,#fbfdff 0%,#f7f9fd 100%);
}
.MarketSignalIdentity{display:flex;align-items:center;gap:11px;min-width:0;}
.MarketSignalThumb{
  width:50px;height:50px;flex:0 0 50px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid #e7ebf2;border-radius:12px;background:#fff;overflow:hidden;
}
.MarketSignalThumb img{width:100%;height:100%;object-fit:contain;padding:4px;}
.MarketSignalTitleWrap{min-width:0;}
.MarketSignalEyebrow{
  display:block;margin-bottom:3px;color:#3568f0;font-size:.59rem;font-weight:900;letter-spacing:.08em;
}
.MarketSignalTitle{
  display:block;color:#1d2939;font-size:.87rem;font-weight:900;line-height:1.35;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.MarketSignalMeta{display:flex;align-items:center;gap:7px;margin-top:4px;color:#7c8798;font-size:.64rem;}
.MarketSignalMeta span{padding-right:7px;border-right:1px solid #e4e8ef;}
.MarketSignalMeta b{color:#344054;font-weight:850;}
.MarketSignalGuide{
  display:flex;align-items:center;gap:6px;flex:0 0 auto;
  padding:7px 9px;border:1px solid #e7ebf2;border-radius:10px;background:#fff;
  color:#7c8798;font-size:.62rem;font-weight:650;
}
.MarketSignalGuide i{color:#6b86ca;}
.MarketSignalPeriodTabs{
  display:grid;grid-template-columns:repeat(4,1fr);gap:5px;
  padding:10px 12px 0;background:#fff;
}
.StatsPeriodButton{
  min-height:34px;border:1px solid #e3e8f0;border-radius:9px;background:#f8fafc;
  color:#667085;font-size:.68rem;font-weight:850;transition:.15s ease;
}
.StatsPeriodButton:hover{border-color:#b9c9f5;background:#f2f6ff;color:#3568f0;}
.StatsPeriodButton.is-active{
  border-color:#3568f0;background:#3568f0;color:#fff;box-shadow:0 5px 12px rgba(53,104,240,.18);
}
.MarketSignalPanel{padding:10px 12px 12px;}
.MarketSignalMetrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;}
.MarketSignalMetric{
  display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;
  column-gap:8px;row-gap:1px;align-items:center;
  padding:10px;border:1px solid #e8edf4;border-radius:11px;background:#fbfcfe;
}
.MarketSignalMetricIcon{
  grid-row:1 / 3;width:30px;height:30px;display:flex;align-items:center;justify-content:center;
  border-radius:9px;background:#eef3ff;color:#4269cf;font-size:.82rem;
}
.MarketSignalMetricText{min-width:0;display:flex;flex-direction:column;}
.MarketSignalMetricText span{color:#344054;font-size:.69rem;font-weight:850;line-height:1.25;}
.MarketSignalMetricText small{margin-top:1px;color:#98a2b3;font-size:.55rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.MarketSignalMetricValue{grid-column:1 / 3;margin-top:6px;font-size:.91rem;font-weight:950;text-align:right;}
.MarketSignalMetricValue.is-positive{color:#128a5b;}
.MarketSignalMetricValue.is-negative{color:#d94b57;}
.MarketSignalMetricValue.is-flat{color:#8b95a5;}
.MarketSignalPeriodNote{
  display:flex;align-items:center;justify-content:flex-end;gap:5px;
  margin-top:8px;color:#98a2b3;font-size:.59rem;
}
.MarketSignalPeriodNote strong{color:#667085;font-weight:850;}
.StuffDetailPage .StuffDetailRisingContent>.MarketSignalCard+ .MarketSignalCard{margin-top:10px;}
.StuffOffsetV2 .StuffOffsetRising{
  padding:12px!important;border:1px solid #e6ebf3!important;border-radius:13px!important;background:#fff!important;
}
.StuffOffsetV2 .StuffOffsetRising .StuffOffsetSectionHead{margin-bottom:9px;}
.StuffOffsetV2 .StuffOffsetRising .MarketSignalHead{padding:11px 12px 9px;}
.StuffOffsetV2 .StuffOffsetRising .MarketSignalThumb{width:42px;height:42px;flex-basis:42px;}
.StuffOffsetV2 .StuffOffsetRising .MarketSignalGuide{display:none;}
.StuffOffsetV2 .StuffOffsetRising .MarketSignalPeriodTabs{padding:8px 9px 0;}
.StuffOffsetV2 .StuffOffsetRising .MarketSignalPanel{padding:8px 9px 9px;}
.StuffOffsetV2 .StuffOffsetRising .MarketSignalMetrics{grid-template-columns:repeat(2,minmax(0,1fr));}

@media (max-width: 767.98px){
  .MarketSignalHead{align-items:flex-start;padding:12px;}
  .MarketSignalGuide{display:none;}
  .MarketSignalThumb{width:44px;height:44px;flex-basis:44px;}
  .MarketSignalTitle{font-size:.8rem;}
  .MarketSignalPeriodTabs{padding:9px 9px 0;gap:4px;}
  .StatsPeriodButton{min-height:32px;font-size:.65rem;}
  .MarketSignalPanel{padding:8px 9px 10px;}
  .MarketSignalMetrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;}
  .MarketSignalMetric{padding:9px;}
  .MarketSignalPeriodNote{justify-content:flex-start;}
  .StuffOffsetV2 .StuffOffsetRising{padding:10px!important;}
}


/* =========================================================
   Stuff detail price history compact V7 - 2026-08-19
   Remove duplicated minimum heights and tighten the chart section.
========================================================= */
.StuffDetailPage .StuffDetailChartSection{
  padding:20px 22px 14px;
}
.StuffDetailPage .StuffDetailChartSection .StuffDetailSectionHead{
  align-items:center;
  margin-bottom:8px;
}
.StuffDetailPage .StuffDetailChartSection .StuffDetailSectionHead p{
  margin-top:4px;
}
.StuffDetailPage .StuffDetailChartMeta{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:6px;
}
.StuffDetailPage .StuffDetailChartMeta span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:30px;
  padding:5px 10px;
  border:1px solid #e2e8f0;
  border-radius:999px;
  background:#f8fafc;
  color:#64748b;
  font-size:.66rem;
  font-weight:750;
  white-space:nowrap;
}
.StuffDetailPage .StuffDetailChartMeta i{
  color:#2f6fd6;
  font-size:.72rem;
}
.StuffDetailPage .StuffDetailChartSection .StuffGraphArea{
  padding:0;
}
.StuffDetailPage .StuffDetailChartSection .GraphViewArea{
  min-height:0;
}
.StuffDetailPage .StuffDetailChartSection .GraphViewArea .GraphPanal{
  display:block;
  min-height:0;
}
.StuffDetailPage .StuffDetailChartSection .c3{
  margin:0;
}
.StuffDetailPage .StuffDetailChartSection .StuffChartLoading{
  min-height:210px;
}

@media (max-width:767.98px){
  .StuffDetailPage .StuffDetailChartSection{
    padding:16px 14px 10px;
  }
  .StuffDetailPage .StuffDetailChartSection .StuffDetailSectionHead{
    gap:8px;
    margin-bottom:6px;
  }
  .StuffDetailPage .StuffDetailChartMeta{
    width:100%;
    justify-content:flex-start;
  }
  .StuffDetailPage .StuffDetailChartMeta span{
    min-height:28px;
    padding:4px 9px;
    font-size:.63rem;
  }
  .StuffDetailPage .StuffDetailChartSection .StuffChartLoading{
    min-height:180px;
  }
}

/* =========================================================
   Stuff detail offcanvas - AI summary polish V1
   2026-08-19
========================================================= */
.StuffOffsetV2 .StuffAiArea{
  padding:16px!important;
  background:linear-gradient(145deg,#f8faff 0%,#ffffff 48%,#fbfcff 100%)!important;
  border-color:#dfe7f6!important;
}
.StuffOffsetV2 .StuffOffsetAiHead{position:relative;z-index:1;align-items:flex-start!important;}
.StuffOffsetV2 .StuffOffsetAiHead>div{min-width:0;}
.StuffOffsetV2 .StuffOffsetAiHead p{max-width:440px;margin-top:4px!important;color:#8792a5!important;font-size:.67rem!important;line-height:1.45!important;word-break:keep-all;}
.StuffOffsetV2 .StuffOffsetAiRefresh{
  flex:0 0 auto;
  min-height:31px;
  padding:6px 10px!important;
  display:inline-flex;
  align-items:center;
  gap:5px;
  border:1px solid #e2e7f0!important;
  border-radius:9px!important;
  background:rgba(255,255,255,.88)!important;
  color:#667085!important;
  font-size:.64rem!important;
  font-weight:800!important;
  box-shadow:0 3px 10px rgba(42,55,83,.045)!important;
}
.StuffOffsetV2 .StuffOffsetAiRefresh:hover{border-color:#cfd9ec!important;background:#f4f7ff!important;color:#405fc1!important;transform:translateY(-1px);}
.StuffOffsetV2 .StuffOffsetAiRefresh i{font-size:.72rem;}

.StuffOffsetV2 .StuffOffsetAiContent{position:relative;z-index:1;color:#4b5768!important;font-size:.73rem!important;line-height:1.62!important;}
.StuffOffsetV2 .StuffOffsetAiContent>.col-12{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section{
  position:relative;
  min-width:0;
  margin:0!important;
  padding:12px 13px 11px;
  overflow:hidden;
  border:1px solid #e7ebf3;
  border-radius:11px;
  background:rgba(255,255,255,.9);
  box-shadow:0 4px 13px rgba(38,50,77,.035);
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:first-child,
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4){grid-column:1/-1;}
.StuffOffsetV2 .StuffOffsetAiContent .c_section::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  width:3px;
  height:100%;
  background:#7185d8;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(2)::before{background:#35a66f;}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(3)::before{background:#e47777;}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4)::before{background:#4b8bd8;}
.StuffOffsetV2 .StuffOffsetAiContent .c_topic{
  display:flex;
  align-items:center;
  gap:6px;
  margin:0 0 7px!important;
  color:#34435a;
  font-size:.69rem;
  font-weight:900;
  line-height:1.3;
  letter-spacing:-.015em;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_topic::before{
  content:'';
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:50%;
  background:#7185d8;
  box-shadow:0 0 0 3px rgba(113,133,216,.10);
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(2) .c_topic::before{background:#35a66f;box-shadow:0 0 0 3px rgba(53,166,111,.10);}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(3) .c_topic::before{background:#e47777;box-shadow:0 0 0 3px rgba(228,119,119,.10);}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4) .c_topic::before{background:#4b8bd8;box-shadow:0 0 0 3px rgba(75,139,216,.10);}
.StuffOffsetV2 .StuffOffsetAiContent .c_section>div{margin:0!important;color:#5b6677;font-size:.71rem;line-height:1.68;word-break:keep-all;}
.StuffOffsetV2 .StuffOffsetAiEmpty{
  min-height:92px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px dashed #dfe5ef;
  border-radius:11px;
  background:rgba(255,255,255,.72);
  color:#98a2b3;
  text-align:center;
}
.StuffOffsetV2 .StuffOffsetAiEmpty i{font-size:1.05rem;color:#7588d7;}
.StuffOffsetV2 .StuffOffsetAiNotice{
  position:relative;
  z-index:1;
  margin-top:10px!important;
  padding:8px 10px!important;
  display:flex;
  align-items:flex-start;
  gap:6px;
  border:0!important;
  border-radius:9px;
  background:#f3f5f9;
  color:#8b95a5!important;
  font-size:.6rem!important;
  line-height:1.45;
}
.StuffOffsetV2 .StuffOffsetAiNotice i{margin-top:1px;flex:0 0 auto;color:#7d8aa0;}

@media(max-width:767.98px){
  .StuffOffsetV2 .StuffAiArea{padding:13px!important;}
  .StuffOffsetV2 .StuffOffsetAiHead{gap:8px!important;}
  .StuffOffsetV2 .StuffOffsetAiHead p{display:block!important;font-size:.62rem!important;}
  .StuffOffsetV2 .StuffOffsetAiRefresh{padding:6px 8px!important;}
  .StuffOffsetV2 .StuffOffsetAiRefresh span{display:none;}
  .StuffOffsetV2 .StuffOffsetAiRefresh i{font-size:.8rem;}
  .StuffOffsetV2 .StuffOffsetAiContent>.col-12{grid-template-columns:1fr;gap:7px;}
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:first-child,
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4){grid-column:auto;}
  .StuffOffsetV2 .StuffOffsetAiContent .c_section{padding:11px 11px 10px;}
  .StuffOffsetV2 .StuffOffsetAiContent .c_section>div{font-size:.69rem;line-height:1.62;}
}

/* =========================================================
   Stuff detail offcanvas - AI summary editorial V2
   2026-08-19
   Remove card/dot/colored-strip styling and present AI copy
   as a compact editorial report.
========================================================= */
.StuffOffsetV2 .StuffAiArea{
  padding:17px 18px 15px!important;
  background:#fff!important;
  border:1px solid #e8edf4!important;
  box-shadow:0 8px 24px rgba(34,48,73,.045)!important;
}
.StuffOffsetV2 .StuffOffsetAiHead{
  margin-bottom:8px!important;
  padding-bottom:12px;
  border-bottom:1px solid #edf0f4;
}
.StuffOffsetV2 .StuffOffsetAiHead p{
  max-width:520px;
  color:#8a94a3!important;
}
.StuffOffsetV2 .StuffOffsetAiRefresh{
  min-height:29px;
  padding:5px 9px!important;
  border-color:#e4e8ef!important;
  border-radius:7px!important;
  background:#fff!important;
  color:#7a8494!important;
  box-shadow:none!important;
}
.StuffOffsetV2 .StuffOffsetAiRefresh:hover{
  border-color:#cfd7e4!important;
  background:#f7f9fc!important;
  color:#43516a!important;
  transform:none;
}

.StuffOffsetV2 .StuffOffsetAiContent{
  color:#4d5868!important;
  font-size:.74rem!important;
  line-height:1.72!important;
}
.StuffOffsetV2 .StuffOffsetAiContent>.col-12{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:0;
  row-gap:0;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section{
  position:relative;
  min-width:0;
  margin:0!important;
  padding:14px 0 15px;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section::before,
.StuffOffsetV2 .StuffOffsetAiContent .c_topic::before{
  content:none!important;
  display:none!important;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:first-child{
  grid-column:1/-1;
  padding-top:12px;
  border-bottom:1px solid #edf0f4;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(2){
  padding-right:27px;
  border-right:1px solid #edf0f4;
  border-bottom:1px solid #edf0f4;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(3){
  padding-left:27px;
  border-bottom:1px solid #edf0f4;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4){
  grid-column:1/-1;
  padding-bottom:7px;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_topic{
  display:block;
  margin:0 0 7px!important;
  color:#27364b;
  font-size:.68rem;
  font-weight:800;
  line-height:1.35;
  letter-spacing:-.015em;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:first-child .c_topic{
  color:#53627a;
  font-size:.64rem;
  letter-spacing:.035em;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4) .c_topic{
  color:#53627a;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section>div{
  margin:0!important;
  color:#586477;
  font-size:.72rem;
  line-height:1.75;
  word-break:keep-all;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:first-child>div{
  color:#445166;
  font-size:.75rem;
  line-height:1.78;
}
.StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4)>div{
  color:#4c596c;
}
.StuffOffsetV2 .StuffOffsetAiNotice{
  margin-top:7px!important;
  padding:9px 0 0!important;
  border-top:1px solid #f0f2f6!important;
  border-radius:0!important;
  background:transparent!important;
  color:#9aa3b0!important;
  font-size:.59rem!important;
}
.StuffOffsetV2 .StuffOffsetAiNotice i{color:#9aa3b0;}

@media(max-width:767.98px){
  .StuffOffsetV2 .StuffAiArea{padding:14px 14px 12px!important;}
  .StuffOffsetV2 .StuffOffsetAiHead{padding-bottom:10px;}
  .StuffOffsetV2 .StuffOffsetAiContent>.col-12{display:block;}
  .StuffOffsetV2 .StuffOffsetAiContent .c_section,
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:first-child,
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(2),
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(3),
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4){
    padding:12px 0 13px;
    border-right:0;
    border-bottom:1px solid #edf0f4;
  }
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:nth-child(4){
    border-bottom:0;
    padding-bottom:5px;
  }
  .StuffOffsetV2 .StuffOffsetAiContent .c_section>div{font-size:.7rem;line-height:1.7;}
  .StuffOffsetV2 .StuffOffsetAiContent .c_section:first-child>div{font-size:.72rem;line-height:1.72;}
}

/* =========================================================
   Stuff detail + offcanvas - AI editorial & price chart V7
   2026-08-19
========================================================= */
/* StuffView AI: one editorial report, not stacked decorative cards */
.StuffDetailPage .StuffDetailAiSection{
  background:#fff;
  border-color:#e7ecf3;
  box-shadow:0 10px 30px rgba(28,39,60,.045);
}
.StuffDetailPage .StuffDetailAiHead{
  align-items:flex-start;
  padding-bottom:14px;
  margin-bottom:2px;
  border-bottom:1px solid #edf1f5;
}
.StuffDetailPage .StuffDetailAiHead h2 i{color:#475569;}
.StuffDetailPage .StuffDetailAiRefresh{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:32px;
  padding:6px 10px;
  border:1px solid #e1e7ef;
  border-radius:8px;
  background:#fff;
  color:#64748b;
  font-size:.67rem;
  font-weight:800;
  box-shadow:none;
}
.StuffDetailPage .StuffDetailAiRefresh:hover{
  border-color:#cbd5e1;
  background:#f8fafc;
  color:#334155;
}
.StuffDetailPage .StuffDetailAiContent{
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#4f5d70;
  font-size:.79rem;
  line-height:1.78;
}
.StuffDetailPage .StuffDetailAiContent>.col-12{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  column-gap:0;
  row-gap:0;
}
.StuffDetailPage .StuffDetailAiContent .c_section{
  min-width:0;
  margin:0!important;
  padding:18px 0 19px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.StuffDetailPage .StuffDetailAiContent .c_section:first-child{
  grid-column:1/-1;
  padding-top:17px;
  border-bottom:1px solid #edf1f5;
}
.StuffDetailPage .StuffDetailAiContent .c_section:nth-child(2){
  padding-right:40px;
  border-right:1px solid #edf1f5;
  border-bottom:1px solid #edf1f5;
}
.StuffDetailPage .StuffDetailAiContent .c_section:nth-child(3){
  padding-left:40px;
  border-bottom:1px solid #edf1f5;
}
.StuffDetailPage .StuffDetailAiContent .c_section:nth-child(4){
  grid-column:1/-1;
  padding-bottom:8px;
}
.StuffDetailPage .StuffDetailAiContent .c_topic{
  display:block;
  margin:0 0 8px!important;
  color:#263448;
  font-size:.72rem;
  font-weight:850;
  line-height:1.35;
  letter-spacing:-.01em;
}
.StuffDetailPage .StuffDetailAiContent .c_section:first-child .c_topic,
.StuffDetailPage .StuffDetailAiContent .c_section:nth-child(4) .c_topic{
  color:#64748b;
  font-size:.67rem;
  letter-spacing:.035em;
}
.StuffDetailPage .StuffDetailAiContent .c_section>div{
  margin:0!important;
  color:#586679;
  font-size:.78rem;
  line-height:1.82;
  word-break:keep-all;
}
.StuffDetailPage .StuffDetailAiContent .c_section:first-child>div{
  color:#3f4d61;
  font-size:.82rem;
  line-height:1.84;
}
.StuffDetailPage .StuffDetailAiNotice{
  margin-top:8px;
  padding-top:10px;
  border-top:1px solid #f0f3f6;
  color:#9aa4b2;
}
.StuffDetailPage .StuffDetailAiEmpty{
  min-height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#94a3b8;
  font-size:.74rem;
}
.StuffDetailPage .StuffDetailAiEmpty i{font-size:1rem;color:#64748b;}

/* Shared C3 price chart treatment */
.StuffDetailPage .StuffDetailChartSection .c3,
.StuffOffsetV2 .StuffGraphArea .c3{
  font-family:inherit;
}
.StuffDetailPage .StuffDetailChartSection .c3 svg,
.StuffOffsetV2 .StuffGraphArea .c3 svg{
  overflow:visible;
  font-family:inherit;
}
.StuffDetailPage .StuffDetailChartSection .c3-axis text,
.StuffOffsetV2 .StuffGraphArea .c3-axis text{
  fill:#8a96a8;
  font-size:10px;
  font-weight:650;
}
.StuffDetailPage .StuffDetailChartSection .c3-axis path,
.StuffDetailPage .StuffDetailChartSection .c3-axis line,
.StuffOffsetV2 .StuffGraphArea .c3-axis path,
.StuffOffsetV2 .StuffGraphArea .c3-axis line{
  stroke:#dce3eb;
}
.StuffDetailPage .StuffDetailChartSection .c3-grid line,
.StuffOffsetV2 .StuffGraphArea .c3-grid line{
  stroke:#edf1f5;
  stroke-dasharray:3 4;
}
.StuffDetailPage .StuffDetailChartSection .c3-ygrid,
.StuffOffsetV2 .StuffGraphArea .c3-ygrid{opacity:.95;}
.StuffDetailPage .StuffDetailChartSection .c3-line,
.StuffOffsetV2 .StuffGraphArea .c3-line{
  stroke-width:2.35px;
}
.StuffDetailPage .StuffDetailChartSection .c3-circle,
.StuffOffsetV2 .StuffGraphArea .c3-circle{
  stroke:#fff;
  stroke-width:1.4px;
}
.StuffDetailPage .StuffDetailChartSection .c3-legend-item text,
.StuffOffsetV2 .StuffGraphArea .c3-legend-item text{
  fill:#596679;
  font-size:10px;
  font-weight:750;
}
.StuffDetailPage .StuffDetailChartSection .c3-legend-item-tile,
.StuffOffsetV2 .StuffGraphArea .c3-legend-item-tile{
  stroke-width:3px;
}
.StuffDetailPage .StuffDetailChartSection .c3-tooltip,
.StuffOffsetV2 .StuffGraphArea .c3-tooltip{
  border:1px solid #e2e8f0;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 12px 28px rgba(15,23,42,.12);
  background:#fff;
}
.StuffDetailPage .StuffDetailChartSection .c3-tooltip th,
.StuffOffsetV2 .StuffGraphArea .c3-tooltip th{
  padding:8px 10px;
  background:#f8fafc;
  color:#475569;
  font-size:10px;
  font-weight:850;
}
.StuffDetailPage .StuffDetailChartSection .c3-tooltip td,
.StuffOffsetV2 .StuffGraphArea .c3-tooltip td{
  padding:7px 10px;
  border-color:#eef2f6;
  color:#475569;
  font-size:10px;
}
.StuffDetailPage .StuffDetailChartSection .c3-tooltip td.value,
.StuffOffsetV2 .StuffGraphArea .c3-tooltip td.value{
  color:#0f172a;
  font-weight:850;
}
.StuffDetailPage .StuffDetailChartSection .GraphPanal,
.StuffOffsetV2 .StuffGraphArea .GraphPanal{
  background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);
}
.StuffDetailPage .StuffDetailChartSection .GraphPanal{
  padding:4px 8px 0;
  border-radius:14px;
}
.StuffOffsetV2 .StuffGraphArea{
  background:#fff!important;
  border-color:#e7ecf3!important;
}
.StuffOffsetV2 .StuffGraphArea .GraphViewArea{
  margin-top:6px;
  padding:6px 3px 0!important;
  border-top:1px solid #f0f3f6;
}
.StuffOffsetV2 .StuffGraphArea .GraphPanal{
  padding:3px 1px 0;
  border-radius:10px;
}

@media(max-width:767.98px){
  .StuffDetailPage .StuffDetailAiHead{gap:10px;}
  .StuffDetailPage .StuffDetailAiRefresh{padding:6px 8px;font-size:.64rem;}
  .StuffDetailPage .StuffDetailAiContent>.col-12{display:block;}
  .StuffDetailPage .StuffDetailAiContent .c_section,
  .StuffDetailPage .StuffDetailAiContent .c_section:first-child,
  .StuffDetailPage .StuffDetailAiContent .c_section:nth-child(2),
  .StuffDetailPage .StuffDetailAiContent .c_section:nth-child(3),
  .StuffDetailPage .StuffDetailAiContent .c_section:nth-child(4){
    padding:13px 0 14px;
    border-right:0;
    border-bottom:1px solid #edf1f5;
  }
  .StuffDetailPage .StuffDetailAiContent .c_section:nth-child(4){border-bottom:0;padding-bottom:5px;}
  .StuffDetailPage .StuffDetailAiContent .c_section>div{font-size:.74rem;line-height:1.75;}
  .StuffDetailPage .StuffDetailAiContent .c_section:first-child>div{font-size:.77rem;line-height:1.78;}
  .StuffDetailPage .StuffDetailChartSection .GraphPanal{padding-left:0;padding-right:0;}
  .StuffDetailPage .StuffDetailChartSection .c3-axis text,
  .StuffOffsetV2 .StuffGraphArea .c3-axis text{font-size:9px;}
}

/* =========================================================
   Stuff price chart states V8 - 2026-08-19
   Detail + offcanvas loading / empty / error presentation
========================================================= */
.StuffDetailPage .StuffPriceChartState,
.StuffOffsetV2 .StuffPriceChartState{
  width:100%;
  min-height:210px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:24px 18px;
  text-align:center;
  background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);
  color:#64748b;
}
.StuffDetailPage .StuffPriceChartStateIcon,
.StuffOffsetV2 .StuffPriceChartStateIcon{
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #e7ebf0;
  border-radius:50%;
  background:#f8fafc;
  color:#748094;
  font-size:1.02rem;
}
.StuffDetailPage .StuffPriceChartStateText,
.StuffOffsetV2 .StuffPriceChartStateText{
  max-width:420px;
}
.StuffDetailPage .StuffPriceChartStateText strong,
.StuffOffsetV2 .StuffPriceChartStateText strong{
  display:block;
  color:#334155;
  font-size:.79rem;
  font-weight:850;
  line-height:1.45;
  letter-spacing:-.01em;
}
.StuffDetailPage .StuffPriceChartStateText span,
.StuffOffsetV2 .StuffPriceChartStateText span{
  display:block;
  margin-top:5px;
  color:#94a3b8;
  font-size:.68rem;
  line-height:1.55;
  word-break:keep-all;
}
.StuffDetailPage .StuffPriceChartState.is-error .StuffPriceChartStateIcon,
.StuffOffsetV2 .StuffPriceChartState.is-error .StuffPriceChartStateIcon{
  background:#fffafa;
  border-color:#f2e5e5;
  color:#b86a6a;
}
.StuffPriceChartStateSpinner{
  width:28px;
  height:28px;
  display:block;
  border:2px solid #e2e8f0;
  border-top-color:#64748b;
  border-radius:50%;
  animation:StuffPriceChartSpin .85s linear infinite;
}
@keyframes StuffPriceChartSpin{to{transform:rotate(360deg)}}
.StuffDetailPage .StuffPriceChartState.is-loading .StuffPriceChartStateText strong,
.StuffOffsetV2 .StuffPriceChartState.is-loading .StuffPriceChartStateText strong{
  color:#475569;
}
.StuffOffsetV2 .StuffPriceChartState{min-height:180px;padding:20px 14px;}
.StuffOffsetV2 .StuffPriceChartStateIcon{width:40px;height:40px;font-size:.94rem;}
.StuffOffsetV2 .StuffPriceChartStateText strong{font-size:.74rem;}
.StuffOffsetV2 .StuffPriceChartStateText span{font-size:.64rem;}
@media(max-width:767.98px){
  .StuffDetailPage .StuffPriceChartState{min-height:185px;padding:20px 14px;}
  .StuffOffsetV2 .StuffPriceChartState{min-height:155px;padding:16px 12px;gap:10px;}
  .StuffDetailPage .StuffPriceChartStateIcon,
  .StuffOffsetV2 .StuffPriceChartStateIcon{width:38px;height:38px;font-size:.9rem;}
}

/* =========================================================
   StuffView long detail floating collapse control V2 - 2026-08-19
   Restored after offset/chart updates; independent from offcanvas control.
   ========================================================= */
.ToggleDescriptionFloatingBtn{
  position:fixed;
  left:50%;
  bottom:22px;
  z-index:1045;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:154px;
  min-height:44px;
  padding:9px 18px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:999px;
  background:#1266df;
  box-shadow:0 10px 28px rgba(20,67,135,.26);
  color:#fff;
  font-size:.78rem;
  font-weight:800;
  line-height:1;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,18px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease,background-color .18s ease,box-shadow .18s ease;
}
.ToggleDescriptionFloatingBtn.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate(-50%,0);
}
.ToggleDescriptionFloatingBtn:hover,
.ToggleDescriptionFloatingBtn:focus{
  background:#0d58c4;
  color:#fff;
  box-shadow:0 12px 32px rgba(20,67,135,.34);
  outline:0;
}
.ToggleDescriptionFloatingBtn i{
  font-size:.92rem;
  line-height:1;
}
@media (max-width:767px){
  .ToggleDescriptionFloatingBtn{
    bottom:calc(14px + env(safe-area-inset-bottom));
    min-width:148px;
    min-height:42px;
    padding:9px 16px;
    font-size:.75rem;
  }
}

/* ========================================================================== 
   PARTS DATABASE PREMIUM UI V2 - 2026-08-19
   ========================================================================== */
.StuffListFrom{
  position:relative;
  background:
    radial-gradient(circle at 8% 0%, rgba(13,110,253,.055), transparent 28rem),
    linear-gradient(180deg,#f8fafc 0,#fff 30rem);
}

.StuffListFrom > .container{
  max-width:1320px;
}

.StuffBreadcrumb{
  padding-top:2px;
}

.StuffBreadcrumb .breadcrumb{
  --bs-breadcrumb-divider-color:#b5bdc7;
}

.StuffPageHeader{
  position:relative;
  overflow:hidden;
  align-items:center;
  min-height:178px;
  padding:30px 32px;
  border:1px solid #e4e9f0;
  border-radius:24px;
  background:
    radial-gradient(circle at 91% 8%, rgba(74,132,255,.16), transparent 19rem),
    linear-gradient(135deg,#ffffff 0%,#f7faff 58%,#edf4ff 100%);
  box-shadow:0 18px 48px rgba(31,45,61,.07);
}

.StuffPageHeader::after{
  content:"";
  position:absolute;
  right:-54px;
  bottom:-92px;
  width:250px;
  height:250px;
  border:44px solid rgba(13,110,253,.045);
  border-radius:50%;
  pointer-events:none;
}

.StuffPageHeaderCopy{
  position:relative;
  z-index:1;
  max-width:760px;
}

.StuffPageEyebrow{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-bottom:10px;
  color:#4f6b91;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.13em;
}

.StuffPageEyebrow i{
  color:#0d6efd;
  font-size:.9rem;
}

.StuffPageTitle{
  color:#162033;
  font-size:clamp(1.75rem,2.5vw,2.45rem);
  font-weight:850;
  letter-spacing:-.055em;
}

.StuffPageDesc{
  max-width:680px;
  color:#667085;
  font-size:.96rem;
  line-height:1.7;
}

.StuffPageCount{
  position:relative;
  z-index:1;
  flex:0 0 auto;
  min-width:176px;
  padding:18px 20px;
  border:1px solid rgba(255,255,255,.88);
  border-radius:18px;
  background:rgba(255,255,255,.72);
  box-shadow:0 10px 28px rgba(55,85,130,.08);
  backdrop-filter:blur(10px);
  text-align:right;
}

.StuffPageCountLabel{
  display:block;
  margin-bottom:4px;
  color:#8b98aa;
  font-size:.63rem;
  font-weight:800;
  letter-spacing:.11em;
}

.StuffPageCount > div{
  display:flex;
  justify-content:flex-end;
  align-items:baseline;
  gap:5px;
  color:#667085;
  font-size:.8rem;
}

.StuffHeroCount{
  margin:0;
  color:#0d6efd;
  font-size:1.8rem;
  font-weight:850;
}

.StuffCategorySection{
  padding:14px;
  border:1px solid #e7ebf1;
  border-radius:18px;
  background:rgba(255,255,255,.92);
  box-shadow:0 7px 24px rgba(31,45,61,.045);
}

.StuffCategoryMain{
  gap:8px;
  padding:0;
}

.StuffCategoryChip,
.StuffCategoryMoreBtn{
  min-height:40px;
  padding:8px 14px;
  border-color:#e2e7ed;
  border-radius:12px;
  color:#566173;
  background:#fbfcfe;
  font-weight:700;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.65);
  transition:transform .15s ease,border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease;
}

.StuffCategoryChip:hover,
.StuffCategoryMoreBtn:hover{
  transform:translateY(-1px);
  border-color:#b9cff9;
  background:#f6f9ff;
  box-shadow:0 6px 16px rgba(13,110,253,.07);
}

.StuffCategoryChip.active,
.StuffCategoryMoreBtn.has-active{
  color:#fff;
  border-color:#0d6efd;
  background:linear-gradient(135deg,#0d6efd,#376fdf);
  box-shadow:0 8px 18px rgba(13,110,253,.22);
}

.StuffCategoryMore{
  margin-top:12px !important;
  padding:14px;
  border-color:#e7ebf0;
  border-radius:14px;
  background:#f7f9fc;
}

.StuffCategoryMini{
  min-height:38px;
  border-color:#e5eaf0;
  border-radius:10px;
  background:#fff;
}

.StuffCategoryMini:hover,
.StuffCategoryMini.active{
  border-color:#b8cff8;
  background:#f6f9ff;
}

.StuffControlPanel{
  padding:14px;
  border:1px solid #e7ebf1;
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 24px rgba(31,45,61,.04);
}

.StuffSearchArea .input-group{
  overflow:hidden;
  border:1px solid #dfe5ec;
  border-radius:13px;
  background:#fff;
  transition:border-color .15s ease,box-shadow .15s ease;
}

.StuffSearchArea .input-group:focus-within{
  border-color:rgba(13,110,253,.55);
  box-shadow:0 0 0 4px rgba(13,110,253,.08);
}

.StuffSearchArea .input-group-text,
.StuffSearchArea .form-control,
.StuffSearchArea .btn{
  min-height:46px;
  border:0 !important;
}

.StuffSearchArea .input-group-text,
.StuffSearchArea .form-control{
  background:#fff;
}

.StuffSearchArea .btn{
  min-width:76px;
  margin:4px;
  min-height:38px;
  border-radius:10px !important;
  font-weight:700;
}

.StuffLimitSelect,
.StuffControlRight #resetBtn{
  min-height:40px;
  border-radius:11px;
}

.StuffToolbar{
  min-height:62px;
  padding:12px 14px;
  border:1px solid #e8ecf1;
  border-radius:16px;
  background:#fff;
}

.StuffResultInfo{
  gap:8px;
}

.StuffListTitle{
  color:#1e293b;
  font-size:1rem;
  font-weight:800;
}

.StuffSortArea .btn{
  min-height:36px;
  padding:7px 12px;
  border-color:#e0e5eb;
  color:#657184;
  background:#fff;
  font-weight:700;
}

.StuffSortArea .btn:hover{
  border-color:#b8cdf4;
  color:#0d6efd;
  background:#f7faff;
}

.StuffSortArea .btn.btn-primary,
.StuffSortArea .btn.active{
  border-color:#0d6efd;
  color:#fff;
  background:#0d6efd;
  box-shadow:0 6px 15px rgba(13,110,253,.16);
}

.StuffListArea{
  gap:12px;
}

.StuffListCard{
  border-color:#e7ebf0 !important;
  border-radius:17px;
  box-shadow:0 5px 18px rgba(31,45,61,.035);
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}

.StuffListCard:hover{
  transform:translateY(-2px);
  border-color:#cad5e2 !important;
  box-shadow:0 14px 34px rgba(31,45,61,.08);
}

.StuffThumbWrap{
  background:linear-gradient(145deg,#fafbfd,#f4f7fa);
}

.StuffProductName{
  color:#1f2937;
  font-size:1.01rem;
  font-weight:750;
  letter-spacing:-.018em;
}

.StuffProductSpec{
  color:#7a8494 !important;
}

.StuffProductPrice{
  color:#e5484d;
  font-size:1.08rem;
  font-weight:800;
  letter-spacing:-.02em;
}

/* Parts pagination: independent from Bootstrap pagination to avoid wrap/layout breakage */
.PageNationArea{
  width:100%;
}

.StuffPaginationShell{
  display:grid;
  grid-template-columns:minmax(150px,1fr) auto minmax(150px,1fr);
  align-items:center;
  gap:20px;
  padding:18px 20px;
  border:1px solid #e5eaf0;
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#fbfcfe);
  box-shadow:0 10px 30px rgba(31,45,61,.055);
}

.StuffPaginationMeta{
  display:flex;
  align-items:baseline;
  gap:6px;
  min-width:0;
  color:#788395;
  font-size:.82rem;
}

.StuffPaginationMeta .StuffPaginationLabel{
  margin-right:2px;
  color:#9aa4b2;
  font-size:.62rem;
  font-weight:850;
  letter-spacing:.12em;
}

.StuffPaginationMeta strong{
  color:#172033;
  font-size:1.02rem;
  font-weight:850;
}

.StuffPaginationMeta small{
  margin-left:7px;
  padding-left:10px;
  border-left:1px solid #e2e7ed;
  color:#9aa4b2;
  white-space:nowrap;
}

.StuffPagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0;
  list-style:none;
}

.StuffPagination .page-link,
.StuffPaginationEdge .page-link{
  border:0;
  box-shadow:none;
}

.StuffPageNumber,
.StuffPageNav{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:40px;
  border:1px solid #e1e6ec;
  border-radius:11px;
  color:#596577;
  background:#fff;
  text-decoration:none;
  font-size:.86rem;
  font-weight:750;
  line-height:1;
  transition:border-color .14s ease,color .14s ease,background .14s ease,box-shadow .14s ease,transform .14s ease;
}

.StuffPageNumber{
  min-width:40px;
  padding:0 10px;
}

.StuffPageNav{
  gap:5px;
  min-width:72px;
  padding:0 11px;
}

.StuffPageNumber:hover,
.StuffPageNav:hover{
  transform:translateY(-1px);
  border-color:#b9cef5;
  color:#0d6efd;
  background:#f7faff;
  box-shadow:0 6px 15px rgba(13,110,253,.08);
}

.StuffPageNumber.is-active{
  border-color:#0d6efd;
  color:#fff;
  background:linear-gradient(135deg,#0d6efd,#3b75df);
  box-shadow:0 7px 18px rgba(13,110,253,.24);
}

.StuffPageNav.is-disabled,
.StuffPaginationEdge .is-disabled{
  color:#c0c6ce;
  border-color:#edf0f3;
  background:#fafbfc;
  cursor:default;
}

.StuffPageEllipsis{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:40px;
  color:#a5adba;
  font-weight:700;
}

.StuffPaginationEdge{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:5px;
  min-width:0;
}

.StuffPaginationEdge a,
.StuffPaginationEdge span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:7px 8px;
  border-radius:9px;
  color:#7a8595;
  text-decoration:none;
  font-size:.75rem;
  font-weight:700;
}

.StuffPaginationEdge a:hover{
  color:#0d6efd;
  background:#f3f7ff;
}

@media (max-width:991.98px){
  .StuffPaginationShell{
    grid-template-columns:1fr;
    gap:13px;
  }

  .StuffPaginationMeta{
    justify-content:center;
    order:2;
  }

  .StuffPagination{
    order:1;
  }

  .StuffPaginationEdge{
    justify-content:center;
    order:3;
  }
}

@media (max-width:767.98px){
  .StuffListFrom > .container{
    padding-left:12px;
    padding-right:12px;
  }

  .StuffPageHeader{
    min-height:auto;
    padding:22px 18px;
    border-radius:19px;
  }

  .StuffPageEyebrow{
    margin-bottom:7px;
    font-size:.64rem;
  }

  .StuffPageTitle{
    font-size:1.65rem;
  }

  .StuffPageDesc{
    font-size:.84rem;
    line-height:1.65;
  }

  .StuffPageCount{
    width:100%;
    min-width:0;
    padding:12px 14px;
    border-radius:14px;
    text-align:left;
  }

  .StuffPageCount > div{
    justify-content:flex-start;
  }

  .StuffHeroCount{
    font-size:1.35rem;
  }

  .StuffCategorySection,
  .StuffControlPanel{
    padding:11px;
    border-radius:15px;
  }

  .StuffCategoryChip,
  .StuffCategoryMoreBtn{
    min-height:37px;
    padding:7px 11px;
    border-radius:10px;
  }

  .StuffControlRight{
    justify-content:space-between;
  }

  .StuffControlRight .StuffLimitSelect{
    flex:1 1 auto;
  }

  .StuffToolbar{
    padding:11px;
    border-radius:14px;
  }

  .StuffListCard{
    border-radius:14px;
  }

  .StuffPaginationShell{
    gap:12px;
    padding:14px 10px;
    border-radius:15px;
  }

  .StuffPagination{
    gap:4px;
  }

  .StuffPageNumber,
  .StuffPageNav{
    height:38px;
    border-radius:10px;
  }

  .StuffPageNumber{
    min-width:38px;
    padding:0 7px;
  }

  .StuffPageNav{
    min-width:42px;
    padding:0 9px;
  }

  .StuffPageNav span{
    display:none;
  }

  .StuffPageEllipsis{
    width:16px;
    height:38px;
  }

  .StuffPaginationMeta{
    flex-wrap:wrap;
    row-gap:3px;
    font-size:.78rem;
  }

  .StuffPaginationMeta small{
    flex-basis:100%;
    margin:0;
    padding:0;
    border:0;
    text-align:center;
  }

  .StuffPaginationEdge a,
  .StuffPaginationEdge span{
    padding:6px;
    font-size:.71rem;
  }
}

@media (max-width:374.98px){
  .StuffPagination{
    gap:3px;
  }

  .StuffPageNumber{
    min-width:35px;
    height:36px;
  }

  .StuffPageNav{
    min-width:36px;
    height:36px;
    padding:0 7px;
  }
}

/* ========================================================================== */
/* PARTS LIST PREMIUM V2 - 2026-08-19                                         */
/* ========================================================================== */

/* Do not reserve a large blank ad rectangle before Google returns a creative. */
.StuffListAd{
  width:100%;
  min-height:0 !important;
  margin-top:12px !important;
  margin-bottom:18px !important;
  padding:0 !important;
}

.StuffListAd > .small{
  margin-bottom:5px !important;
  font-size:.66rem;
  letter-spacing:.04em;
  color:#a1aab7 !important;
}

.StuffListAd .PcAdStage{
  min-height:0 !important;
  height:auto !important;
}

.StuffListAd .PcAdStage > ins.adsbygoogle{
  min-height:0 !important;
}

.StuffToolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:18px 20px;
  border:1px solid #e5eaf0;
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfcfe 100%);
  box-shadow:0 9px 30px rgba(18,38,63,.045);
}

.StuffResultInfo{
  min-width:0;
}

.StuffResultHeading{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.StuffResultEyebrow{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  height:24px;
  padding:0 8px;
  border-radius:7px;
  background:#eef5ff;
  color:#2c6bcf;
  font-size:.61rem;
  font-weight:850;
  letter-spacing:.08em;
}

.StuffListTitle{
  min-width:0;
  color:#172033;
  font-size:1.02rem;
  font-weight:850;
  letter-spacing:-.025em;
}

.StuffResultDescription{
  margin-top:6px;
  color:#7c8798;
  font-size:.79rem;
  line-height:1.45;
}

.StuffResultDescription .DataCount{
  color:#1d66d1;
  font-weight:800;
}

.StuffListArea{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.StuffDataRow{
  margin:0 !important;
}

.StuffListCard{
  overflow:hidden;
  border:1px solid #e5eaf0 !important;
  border-radius:18px !important;
  background:#fff;
  box-shadow:0 5px 18px rgba(22,38,63,.035);
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}

.StuffListCard:hover{
  transform:translateY(-1px);
  border-color:#cfdcf0 !important;
  box-shadow:0 12px 30px rgba(28,58,101,.075);
}

.StuffListCardInner{
  display:grid;
  grid-template-columns:126px minmax(0,1fr) 176px;
  gap:18px;
  align-items:stretch;
  min-height:128px;
  padding:14px 16px 14px 14px;
}

.StuffThumbWrap{
  display:flex;
  align-items:center;
  justify-content:center;
  width:126px;
  height:100px;
  align-self:center;
  overflow:hidden;
  border:1px solid #edf0f4;
  border-radius:13px;
  background:#fbfcfd;
}

.StuffThumb{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  padding:6px;
}

.StuffThumbFallback{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  color:#aeb8c6;
  font-size:2rem;
}

.StuffCardContent{
  min-width:0;
  align-self:center;
  padding:2px 0;
}

.StuffCardMeta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:7px;
}

.StuffTypeBadge,
.StuffTrendBadge,
.StuffSoldoutBadge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:22px;
  padding:3px 8px;
  border-radius:999px;
  font-size:.66rem;
  font-weight:800;
  line-height:1;
}

.StuffTypeBadge{
  border:1px solid #e1e6ec;
  background:#f7f9fb;
  color:#576274;
}

.StuffTrendBadge{
  background:#eaf3ff;
  color:#2168c8;
}

.StuffSoldoutBadge{
  background:#f1f3f5;
  color:#7a8492;
}

.StuffProductName{
  display:block;
  width:100%;
  overflow:hidden;
  color:#172033 !important;
  font-size:.92rem !important;
  font-weight:850 !important;
  line-height:1.4;
  letter-spacing:-.025em;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.StuffProductName:hover{
  color:#145fc7 !important;
}

.StuffProductSpec{
  display:-webkit-box;
  overflow:hidden;
  margin-top:7px;
  color:#7b8797;
  font-size:.74rem;
  line-height:1.55;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

.StuffCardAside{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-end;
  min-width:0;
  padding-left:18px;
  border-left:1px solid #edf0f4;
}

.StuffCardPriceLabel{
  margin-bottom:3px;
  color:#a0a8b5;
  font-size:.65rem;
  font-weight:750;
}

.StuffProductPrice{
  color:#ef4f63;
  font-size:1.02rem;
  font-weight:900;
  letter-spacing:-.03em;
  white-space:nowrap;
}

.StuffProductPrice.is-empty{
  color:#929cab;
  font-size:.76rem;
  font-weight:700;
}

.StuffCardActions{
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:13px;
}

.StuffDetailBtn,
.StuffCompareBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:34px;
  padding:7px 11px;
  border-radius:10px;
  text-decoration:none;
  font-size:.72rem;
  font-weight:800;
  line-height:1;
  transition:all .14s ease;
}

.StuffDetailBtn{
  border:1px solid #dce3eb;
  background:#fff;
  color:#556273;
}

.StuffDetailBtn:hover{
  border-color:#b8c9df;
  background:#f8fafc;
  color:#24364d;
}

.StuffCompareBtn{
  border:1px solid #b9d3fb;
  background:#eef5ff;
  color:#1a66cf;
}

.StuffCompareBtn:hover{
  border-color:#85b4f5;
  background:#e3efff;
  color:#0d5ecb;
}

/* Pagination V2: page numbers themselves act as first/last links. */
.StuffPaginationShellV2{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:22px 18px 18px;
  border:1px solid #e4e9ef;
  border-radius:18px;
  background:linear-gradient(180deg,#fff 0%,#fbfcfe 100%);
  box-shadow:0 8px 26px rgba(18,38,63,.04);
}

.StuffPaginationMain{
  display:flex;
  justify-content:center;
  width:100%;
}

.StuffPagination{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:7px;
  padding:0;
  list-style:none;
}

.StuffPageNumber,
.StuffPageNav{
  height:44px;
  border:1px solid #dfe5ec;
  border-radius:12px;
  background:#fff;
  color:#566375;
  font-size:.82rem;
  font-weight:800;
}

.StuffPageNumber{
  min-width:44px;
  padding:0 11px;
}

.StuffPageNav{
  min-width:86px;
  padding:0 14px;
}

.StuffPageNumber:hover,
.StuffPageNav:hover{
  border-color:#abc9f5;
  background:#f3f8ff;
  color:#1465d2;
  box-shadow:0 7px 16px rgba(13,110,253,.08);
}

.StuffPageNumber.is-active{
  border-color:#1769df;
  background:linear-gradient(135deg,#1769df,#2f7bf0);
  color:#fff;
  box-shadow:0 8px 18px rgba(23,105,223,.23);
}

.StuffPageNav.is-disabled{
  border-color:#edf0f3;
  background:#fafbfc;
  color:#c0c7d1;
}

.StuffPageEllipsis{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:44px;
  color:#9ba5b4;
  font-size:.9rem;
  font-weight:800;
}

.StuffPaginationMetaV2{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:#8993a2;
  font-size:.73rem;
  text-align:center;
}

.StuffPaginationMetaV2 strong{
  color:#475467;
  font-size:.76rem;
}

.StuffPaginationMetaV2 span::before{
  content:'·';
  margin-right:9px;
  color:#c4cad2;
}

@media (max-width:991.98px){
  .StuffToolbar{
    align-items:flex-start;
    flex-direction:column;
  }

  .StuffSortArea{
    width:100%;
    overflow-x:auto;
    padding-bottom:2px;
    scrollbar-width:none;
  }

  .StuffSortArea::-webkit-scrollbar{
    display:none;
  }

  .StuffListCardInner{
    grid-template-columns:112px minmax(0,1fr) 156px;
    gap:14px;
  }

  .StuffThumbWrap{
    width:112px;
    height:96px;
  }

  .StuffCardAside{
    padding-left:14px;
  }
}

@media (max-width:767.98px){
  .StuffListAd{
    margin-top:8px !important;
    margin-bottom:12px !important;
  }

  .StuffToolbar{
    gap:13px;
    padding:15px 14px;
  }

  .StuffResultHeading{
    flex-wrap:wrap;
    gap:7px;
  }

  .StuffResultDescription{
    font-size:.75rem;
  }

  .StuffListArea{
    gap:9px;
  }

  .StuffListCardInner{
    grid-template-columns:88px minmax(0,1fr);
    gap:12px;
    min-height:0;
    padding:12px;
  }

  .StuffThumbWrap{
    width:88px;
    height:88px;
    align-self:start;
  }

  .StuffCardContent{
    align-self:start;
    padding-top:1px;
  }

  .StuffProductName{
    display:-webkit-box;
    white-space:normal;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:.85rem !important;
  }

  .StuffProductSpec{
    margin-top:5px;
    font-size:.69rem;
    -webkit-line-clamp:2;
  }

  .StuffCardAside{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      'label actions'
      'price actions';
    align-items:center;
    justify-items:start;
    gap:0 12px;
    width:100%;
    padding:10px 0 0;
    border-top:1px solid #edf0f4;
    border-left:0;
  }

  .StuffCardPriceLabel{
    grid-area:label;
  }

  .StuffProductPrice{
    grid-area:price;
  }

  .StuffCardActions{
    grid-area:actions;
    margin-top:0;
  }

  .StuffDetailBtn,
  .StuffCompareBtn{
    min-height:36px;
  }

  .StuffPaginationShellV2{
    gap:11px;
    padding:16px 10px 14px;
  }

  .StuffPagination{
    gap:4px;
    flex-wrap:nowrap;
    width:100%;
  }

  .StuffPageNumber,
  .StuffPageNav{
    height:40px;
    border-radius:10px;
    font-size:.77rem;
  }

  .StuffPageNumber{
    min-width:38px;
    padding:0 7px;
  }

  .StuffPageNav{
    min-width:40px;
    padding:0 9px;
  }

  .StuffPageNav span{
    display:none;
  }

  .StuffPageEllipsis{
    width:14px;
    height:40px;
  }

  .StuffPaginationMetaV2{
    flex-direction:column;
    gap:3px;
    font-size:.69rem;
  }

  .StuffPaginationMetaV2 span::before{
    content:none;
  }
}

@media (max-width:374.98px){
  .StuffListCardInner{
    grid-template-columns:78px minmax(0,1fr);
    gap:10px;
  }

  .StuffThumbWrap{
    width:78px;
    height:78px;
  }

  .StuffCardActions{
    gap:5px;
  }

  .StuffDetailBtn,
  .StuffCompareBtn{
    padding:7px 9px;
    font-size:.68rem;
  }

  .StuffPageNumber{
    min-width:34px;
    padding:0 5px;
  }

  .StuffPageNav{
    min-width:35px;
    padding:0 7px;
  }
}

/* ========================================================================== */
/* PARTS LIST PREMIUM V3 - 2026-08-19                                         */
/* ========================================================================== */

/* Collapse only an AdSense slot that Google explicitly reports as unfilled. */
.StuffListAd.is-ad-unfilled,
.StuffListAd:has(> .PcAdStage > ins.adsbygoogle[data-ad-status="unfilled"]){
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}

/* Keep pending/filled ads natural-sized; never crop a real creative. */
.StuffListAd:not(.is-ad-unfilled){
  min-height:0 !important;
}

/* Product cards: slightly more breathing room without becoming oversized. */
.StuffListArea{
  gap:11px;
}

.StuffListCardInner{
  grid-template-columns:132px minmax(0,1fr) 196px;
  gap:20px;
  min-height:140px;
  padding:16px 18px 16px 16px;
}

.StuffThumbWrap{
  width:116px;
  height:108px;
  border-radius:14px;
}

.StuffThumb{
  padding:7px;
}

.StuffCardMeta{
  margin-bottom:8px;
}

.StuffProductName{
  font-size:.97rem !important;
  line-height:1.42;
}

.StuffProductSpec{
  margin-top:8px;
  color:#748093;
  font-size:.755rem;
  line-height:1.58;
}

.StuffCardAside{
  padding-left:20px;
}

.StuffCardPriceLabel{
  margin-bottom:4px;
  font-size:.66rem;
}

.StuffProductPrice{
  font-size:1.08rem;
}

.StuffCardActions{
  gap:8px;
  margin-top:14px;
}

.StuffDetailBtn,
.StuffCompareBtn{
  min-height:36px;
  padding:8px 12px;
  font-size:.735rem;
}

/* Pagination: reduce empty container space and give the controls more weight. */
.StuffPaginationShellV2{
  gap:10px;
  padding:16px 16px 14px;
  border-radius:16px;
}

.StuffPagination{
  gap:8px;
}

.StuffPageNumber,
.StuffPageNav{
  height:46px;
  border-radius:12px;
  font-size:.84rem;
}

.StuffPageNumber{
  min-width:46px;
  padding:0 12px;
}

.StuffPageNav{
  min-width:90px;
  padding:0 15px;
}

.StuffPageEllipsis{
  height:46px;
}

.StuffPaginationMetaV2{
  font-size:.74rem;
}

.StuffPaginationMetaV2 strong{
  font-size:.78rem;
}

@media (max-width:991.98px){
  .StuffListCardInner{
    grid-template-columns:118px minmax(0,1fr) 176px;
    gap:16px;
    min-height:132px;
  }

  .StuffThumbWrap{
    width:108px;
    height:100px;
  }

  .StuffCardAside{
    padding-left:16px;
  }
}

@media (max-width:767.98px){
  .StuffListArea{
    gap:10px;
  }

  .StuffListCardInner{
    grid-template-columns:92px minmax(0,1fr);
    gap:13px;
    padding:13px;
  }

  .StuffThumbWrap{
    width:92px;
    height:92px;
  }

  .StuffProductName{
    font-size:.88rem !important;
  }

  .StuffProductSpec{
    font-size:.7rem;
  }

  .StuffPaginationShellV2{
    gap:9px;
    padding:13px 9px 12px;
  }

  .StuffPagination{
    gap:5px;
  }

  .StuffPageNumber,
  .StuffPageNav{
    height:42px;
  }

  .StuffPageNumber{
    min-width:40px;
    padding:0 8px;
  }

  .StuffPageNav{
    min-width:42px;
    padding:0 9px;
  }

  .StuffPageEllipsis{
    height:42px;
  }
}

@media (max-width:374.98px){
  .StuffListCardInner{
    grid-template-columns:82px minmax(0,1fr);
  }

  .StuffThumbWrap{
    width:82px;
    height:82px;
  }
}

/* ========================================================================== */
/* PARTS LIST PREMIUM V4 - 2026-08-19                                         */
/* ========================================================================== */

/* The parts ad must never leave an empty billboard when Google sends no ad. */
.StuffListAd.is-ad-unfilled,
.StuffListAd:has(.PcAdStage > ins.adsbygoogle[data-ad-status="unfilled"]){
  display:none !important;
  visibility:hidden !important;
  width:0 !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  overflow:hidden !important;
}

/* Pending requests keep only the space Google itself creates. */
.StuffListAd.is-ad-pending{
  min-height:0 !important;
  margin-top:8px !important;
  margin-bottom:10px !important;
  padding:0 !important;
}

/* Hide the sponsor caption until a creative is actually confirmed. */
.StuffListAd.is-ad-pending > .small,
.StuffListAd.is-ad-unfilled > .small{
  display:none !important;
}

.StuffListAd.is-ad-filled{
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin-top:14px !important;
  margin-bottom:20px !important;
  visibility:visible !important;
}

.StuffListAd.is-ad-filled > .small{
  display:block !important;
}

/* Keep the list visually attached to the toolbar when the ad disappears. */
.StuffToolbar + .StuffListAd.is-ad-unfilled + main,
.StuffToolbar + .StuffListAd:has(.PcAdStage > ins.adsbygoogle[data-ad-status="unfilled"]) + main{
  margin-top:0 !important;
}

/* Final card polish: clearer interaction without making the list flashy. */
.StuffListCard{
  border-color:#e2e8f0 !important;
}

.StuffListCard:hover{
  transform:translateY(-2px);
  border-color:#c7d8ee !important;
  box-shadow:0 14px 34px rgba(28,58,101,.085);
}

.StuffListCard:hover .StuffProductName{
  color:#145fc7 !important;
}

.StuffCardAside{
  background:linear-gradient(90deg,rgba(248,250,253,.15) 0%,rgba(248,250,253,.68) 100%);
}

@media (max-width:767.98px){
  .StuffListAd.is-ad-pending{
    margin-top:5px !important;
    margin-bottom:7px !important;
  }

  .StuffListAd.is-ad-filled{
    margin-top:10px !important;
    margin-bottom:14px !important;
  }

  .StuffCardAside{
    background:transparent;
  }
}



/* =========================================================
   Stuff info offcanvas quick navigation V6 - 2026-08-19
   오프캔버스 상단 탭 도킹형 정리
========================================================= */
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetQuickNav{
  position:sticky;
  top:0;
  z-index:32;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:2px;
  width:100%;
  margin:0 0 12px;
  padding:5px 6px 6px;
  overflow:visible;
  border:0;
  border-bottom:1px solid #e6ebf2;
  border-radius:0;
  background:rgba(247,249,252,.97);
  box-shadow:0 6px 14px rgba(31,43,70,.035);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem{
  position:relative;
  min-width:0;
  min-height:40px;
  padding:7px 6px 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#768197;
  font-size:.69rem;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  box-shadow:none;
  transition:background .15s ease,color .15s ease,transform .15s ease;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem::after{
  content:'';
  position:absolute;
  left:24%;
  right:24%;
  bottom:-6px;
  height:2px;
  border-radius:999px;
  background:transparent;
  transform:scaleX(.5);
  opacity:0;
  transition:transform .15s ease,opacity .15s ease,background .15s ease;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem i{
  font-size:.82rem;
  color:#8793a8;
  transition:color .15s ease;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem:hover{
  background:#f0f4fa;
  color:#41516d;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem.is-active{
  background:#edf3ff;
  color:#2f61d5;
  box-shadow:none;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem.is-active i{color:#3568f0;}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem.is-active::after{
  background:#3568f0;
  transform:scaleX(1);
  opacity:1;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetAnchorSection,
.StuffInfoCanvas .StuffOffsetV2 #StuffOffsetSummary{scroll-margin-top:62px;}

@media (max-width:767.98px){
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetQuickNav{
    gap:1px;
    margin-bottom:9px;
    padding:4px 2px 5px;
  }
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem{
    min-height:38px;
    padding:6px 2px 7px;
    gap:4px;
    border-radius:8px;
    font-size:.62rem;
  }
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem i{font-size:.75rem;}
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem::after{left:30%;right:30%;bottom:-5px;}
}

/* =========================================================
   Stuff info offcanvas quick navigation V7 - 2026-08-19
   헤더-탭-콘텐츠 일체형 플러시 탭바
========================================================= */
.StuffInfoCanvas .offcanvas-body{
  padding-top:0!important;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetQuickNav{
  position:sticky;
  top:0;
  z-index:34;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0;
  width:auto;
  margin:0 -18px 0;
  padding:0;
  overflow:visible;
  border:0;
  border-bottom:1px solid #e4e9f0;
  border-radius:0;
  background:rgba(255,255,255,.985);
  box-shadow:0 2px 8px rgba(31,43,70,.025);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem{
  position:relative;
  min-width:0;
  min-height:52px;
  padding:0 6px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#7d889c;
  font-size:.69rem;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  box-shadow:none;
  transition:color .16s ease,background .16s ease;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem::after{
  content:'';
  position:absolute;
  left:30%;
  right:30%;
  bottom:0;
  height:2px;
  border-radius:2px 2px 0 0;
  background:#3568f0;
  transform:scaleX(.25);
  transform-origin:center;
  opacity:0;
  transition:transform .16s ease,opacity .16s ease;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem i{
  font-size:.82rem;
  color:#8c98ac;
  transition:color .16s ease;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem:hover{
  background:#fafbfe;
  color:#47556d;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem.is-active{
  background:transparent;
  color:#3568f0;
  box-shadow:none;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem.is-active i{
  color:#3568f0;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem.is-active::after{
  transform:scaleX(1);
  opacity:1;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetQuickNav + *{
  margin-top:0!important;
}
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetAnchorSection,
.StuffInfoCanvas .StuffOffsetV2 #StuffOffsetSummary{
  scroll-margin-top:54px;
}

@media (max-width:767.98px){
  .StuffInfoCanvas .offcanvas-body{
    padding-top:0!important;
  }
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetQuickNav{
    margin-left:-12px;
    margin-right:-12px;
  }
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem{
    min-height:46px;
    padding:0 2px;
    gap:4px;
    font-size:.61rem;
  }
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem i{
    font-size:.74rem;
  }
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetNavItem::after{
    left:32%;
    right:32%;
  }
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetAnchorSection,
  .StuffInfoCanvas .StuffOffsetV2 #StuffOffsetSummary{
    scroll-margin-top:48px;
  }
}

/* =========================================================
   Stuff info offcanvas quick navigation V8 - 2026-08-19
   탭바와 첫 콘텐츠 사이 시각적 여백 보완
========================================================= */
.StuffInfoCanvas .StuffOffsetV2 .StuffOffsetQuickNav + *{
  margin-top:14px!important;
}

@media (max-width:767.98px){
  .StuffInfoCanvas .StuffOffsetV2 .StuffOffsetQuickNav + *{
    margin-top:10px!important;
  }
}

/* ========================================================================== */
/* PARTS LIST PREMIUM V5 - 2026-08-19                                         */
/* Readability + mobile density polish                                        */
/* ========================================================================== */
.StuffListFrom .StuffResultDescription{
  color:#8a94a3;
  font-size:.76rem;
  line-height:1.45;
}

.StuffListFrom .StuffListCardInner{
  min-height:132px;
  padding:15px 17px 15px 15px;
}

.StuffListFrom .StuffCardContent{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
}

.StuffListFrom .StuffCardMeta{
  gap:5px;
  margin-bottom:7px;
}

.StuffListFrom .StuffTypeBadge,
.StuffListFrom .StuffTrendBadge,
.StuffListFrom .StuffSoldoutBadge{
  min-height:21px;
  padding:3px 7px;
  font-size:.63rem;
}

.StuffListFrom .StuffProductName{
  max-width:100%;
  color:#202b3c;
  font-size:.96rem !important;
  font-weight:800;
  line-height:1.4;
}

.StuffListFrom .StuffProductSpec{
  margin-top:7px;
  color:#778396 !important;
  font-size:.76rem;
  line-height:1.62;
  -webkit-line-clamp:2;
}

.StuffListFrom .StuffCardAside{
  min-width:176px;
  padding-left:18px;
}

.StuffListFrom .StuffCardPriceLabel{
  color:#99a3b2;
  font-size:.63rem;
  font-weight:800;
  letter-spacing:.025em;
}

.StuffListFrom .StuffProductPrice{
  color:#e4475b;
  font-size:1.04rem;
  font-weight:900;
}

.StuffListFrom .StuffCardActions{
  gap:7px;
  margin-top:11px;
}

.StuffListFrom .StuffDetailBtn,
.StuffListFrom .StuffCompareBtn{
  min-height:34px;
  padding:7px 11px;
  border-radius:9px;
  font-size:.7rem;
  font-weight:800;
}

.StuffListFrom .StuffToolbar{
  gap:18px;
}

.StuffListFrom .StuffSortArea .btn{
  min-height:34px;
  padding:6px 11px;
  font-size:.72rem;
}

@media (max-width:991.98px){
  .StuffListFrom .StuffCardAside{
    min-width:158px;
  }
}

@media (max-width:767.98px){
  .StuffListFrom .container{
    padding-left:12px;
    padding-right:12px;
  }

  .StuffListFrom .StuffPageHeader{
    gap:12px;
    padding:18px 15px;
  }

  .StuffListFrom .StuffPageTitle{
    font-size:1.45rem;
  }

  .StuffListFrom .StuffPageDesc{
    font-size:.79rem;
    line-height:1.55;
  }

  .StuffListFrom .StuffPageCount{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 12px;
  }

  .StuffListFrom .StuffPageCountLabel{
    margin:0;
  }

  .StuffListFrom .StuffHeroCount{
    font-size:1.18rem;
  }

  .StuffListFrom .StuffCategorySection{
    padding:9px;
  }

  .StuffListFrom .StuffCategoryChip,
  .StuffListFrom .StuffCategoryMoreBtn{
    min-height:35px;
    padding:6px 10px;
    font-size:.77rem;
  }

  .StuffListFrom .StuffControlPanel{
    gap:8px;
    padding:9px;
  }

  .StuffListFrom .StuffSearchArea .input-group-text,
  .StuffListFrom .StuffSearchArea .form-control,
  .StuffListFrom .StuffSearchArea .btn{
    min-height:42px;
  }

  .StuffListFrom .StuffSearchArea .btn{
    min-width:64px;
    min-height:34px;
    padding-left:12px;
    padding-right:12px;
    font-size:.78rem;
  }

  .StuffListFrom .StuffToolbar{
    gap:9px;
    padding:11px;
  }

  .StuffListFrom .StuffResultHeading{
    gap:6px;
  }

  .StuffListFrom .StuffListTitle{
    font-size:.9rem;
  }

  .StuffListFrom .StuffResultDescription{
    font-size:.69rem;
  }

  .StuffListFrom .StuffSortArea{
    margin:0 -2px;
    padding:0 2px 2px;
    scroll-snap-type:x proximity;
  }

  .StuffListFrom .StuffSortArea .btn{
    flex:0 0 auto;
    min-height:33px;
    padding:6px 10px;
    font-size:.68rem;
    scroll-snap-align:start;
  }

  .StuffListFrom .StuffListArea{
    gap:8px;
  }

  .StuffListFrom .StuffListCardInner{
    grid-template-columns:78px minmax(0,1fr);
    gap:10px;
    padding:11px;
  }

  .StuffListFrom .StuffThumbWrap{
    width:78px;
    height:78px;
    border-radius:12px;
  }

  .StuffListFrom .StuffThumb{
    padding:5px;
  }

  .StuffListFrom .StuffCardMeta{
    gap:4px;
    margin-bottom:5px;
  }

  .StuffListFrom .StuffTypeBadge,
  .StuffListFrom .StuffTrendBadge,
  .StuffListFrom .StuffSoldoutBadge{
    min-height:19px;
    padding:2px 6px;
    font-size:.58rem;
  }

  .StuffListFrom .StuffProductName{
    font-size:.82rem !important;
    line-height:1.38;
  }

  .StuffListFrom .StuffProductSpec{
    margin-top:4px;
    font-size:.65rem;
    line-height:1.48;
    -webkit-line-clamp:2;
  }

  .StuffListFrom .StuffCardAside{
    grid-template-columns:minmax(0,1fr) auto;
    min-width:0;
    gap:0 8px;
    padding-top:9px;
  }

  .StuffListFrom .StuffCardPriceLabel{
    font-size:.58rem;
  }

  .StuffListFrom .StuffProductPrice{
    font-size:.92rem;
  }

  .StuffListFrom .StuffCardActions{
    gap:5px;
  }

  .StuffListFrom .StuffDetailBtn,
  .StuffListFrom .StuffCompareBtn{
    min-height:32px;
    padding:6px 8px;
    border-radius:8px;
    font-size:.64rem;
  }
}

@media (max-width:374.98px){
  .StuffListFrom .StuffListCardInner{
    grid-template-columns:72px minmax(0,1fr);
    gap:9px;
    padding:10px;
  }

  .StuffListFrom .StuffThumbWrap{
    width:72px;
    height:72px;
  }

  .StuffListFrom .StuffDetailBtn,
  .StuffListFrom .StuffCompareBtn{
    padding:6px 7px;
    font-size:.61rem;
  }
}

/* =========================================================
   Product detail DB images - square corners
   2026-08-19
   상세 페이지 / 오프캔버스 제품 상세 정보 이미지는 원본 모서리 유지
========================================================= */
.StuffDetailPage .StuffDetailDescriptionContent img,
.StuffOffsetV2 .StuffDiscriptionContent img{
  border-radius:0!important;
}

/* Stuff detail - individual buy timing index */
.StuffDetailPage .StuffBuyTimingCard{
  display:grid;
  grid-template-columns:190px minmax(0,1fr);
  gap:22px;
  align-items:center;
  margin-top:20px;
  padding:18px 20px;
  border:1px solid #e4eaf1;
  border-radius:18px;
  background:#fbfcfe;
}
.StuffDetailPage .StuffBuyTimingGaugeWrap{text-align:center;min-width:0;}
.StuffDetailPage .StuffBuyTimingGauge{width:100%;max-width:180px;margin:0 auto;}
.StuffDetailPage .StuffBuyTimingGaugeFace{position:relative;height:88px;overflow:hidden;}
.StuffDetailPage .StuffBuyTimingGaugeFace:before{
  content:"";
  position:absolute;
  left:2%;right:2%;bottom:-84px;
  height:168px;
  border-radius:50%;
  background:conic-gradient(from 270deg,#ef4444 0deg 36deg,#f97316 36deg 72deg,#f2c94c 72deg 108deg,#4fc38b 108deg 144deg,#16a56a 144deg 180deg,#e8edf3 180deg 360deg);
}
.StuffDetailPage .StuffBuyTimingGauge.is-insufficient .StuffBuyTimingGaugeFace:before{filter:grayscale(1);opacity:.38;}
.StuffDetailPage .StuffBuyTimingGaugeInner{position:absolute;z-index:2;left:15%;right:15%;bottom:-61px;height:122px;border-radius:50%;background:#fbfcfe;}
.StuffDetailPage .StuffBuyTimingNeedle{position:absolute;z-index:4;width:38%;height:3px;left:12%;bottom:6px;transform-origin:100% 50%;background:linear-gradient(90deg,transparent 0%,#303947 25%,#111827 100%);border-radius:999px;}
.StuffDetailPage .StuffBuyTimingNeedle span{position:absolute;left:0;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;background:#111827;}
.StuffDetailPage .StuffBuyTimingHub{position:absolute;z-index:5;left:50%;bottom:0;transform:translateX(-50%);width:15px;height:15px;border:4px solid #fbfcfe;border-radius:50%;background:#111827;box-shadow:0 2px 7px rgba(15,23,42,.22);}
.StuffDetailPage .StuffBuyTimingScale{display:flex;justify-content:space-between;margin-top:3px;color:#94a0af;font-size:.58rem;font-weight:800;}
.StuffDetailPage .StuffBuyTimingScore{display:flex;align-items:baseline;justify-content:center;gap:4px;margin-top:5px;line-height:1;}
.StuffDetailPage .StuffBuyTimingScore strong{color:#172033;font-size:2rem;font-weight:900;letter-spacing:-.055em;}
.StuffDetailPage .StuffBuyTimingScore span{color:#8b97a7;font-size:.68rem;font-weight:800;}
.StuffDetailPage .StuffBuyTimingScore i{margin-right:3px;color:#8b97a7;font-size:1rem;}
.StuffDetailPage .StuffBuyTimingGauge.is-insufficient + .StuffBuyTimingScore strong{font-size:.88rem;letter-spacing:-.02em;color:#6f7c8d;}
.StuffDetailPage .StuffBuyTimingContent{min-width:0;}
.StuffDetailPage .StuffBuyTimingTitle>span{display:block;color:#3472d8;font-size:.6rem;font-weight:850;letter-spacing:.11em;}
.StuffDetailPage .StuffBuyTimingTitle h3{margin:4px 0 8px;color:#172033;font-size:.94rem;font-weight:900;letter-spacing:-.03em;}
.StuffDetailPage .StuffBuyTimingVerdict{margin-bottom:5px;font-size:1.05rem;font-weight:900;letter-spacing:-.025em;}
.StuffDetailPage .StuffBuyTimingContent>p{margin:0;color:#788596;font-size:.72rem;line-height:1.55;}
.StuffDetailPage .StuffBuyTimingFacts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:12px;}
.StuffDetailPage .StuffBuyTimingFacts span{padding:8px 9px;border:1px solid #e8edf3;border-radius:10px;background:#fff;min-width:0;}
.StuffDetailPage .StuffBuyTimingFacts small{display:block;margin-bottom:2px;color:#909baa;font-size:.56rem;font-weight:750;}
.StuffDetailPage .StuffBuyTimingFacts b{display:block;overflow:hidden;color:#344054;font-size:.68rem;font-weight:850;text-overflow:ellipsis;white-space:nowrap;}
.StuffDetailPage .StuffBuyTimingDataNotice{display:inline-flex;align-items:center;gap:6px;margin-top:11px;padding:7px 10px;border-radius:9px;background:#f1f4f7;color:#7e8998;font-size:.64rem;font-weight:750;}
.StuffDetailPage .StuffBuyTimingTone--verygood .StuffBuyTimingVerdict{color:#12835e;}
.StuffDetailPage .StuffBuyTimingTone--good .StuffBuyTimingVerdict{color:#239268;}
.StuffDetailPage .StuffBuyTimingTone--normal .StuffBuyTimingVerdict{color:#927818;}
.StuffDetailPage .StuffBuyTimingTone--bad .StuffBuyTimingVerdict{color:#c36b1e;}
.StuffDetailPage .StuffBuyTimingTone--verybad .StuffBuyTimingVerdict{color:#ca3d3d;}
.StuffDetailPage .StuffBuyTimingTone--insufficient .StuffBuyTimingVerdict{color:#667386;}
@media(max-width:767.98px){
  .StuffDetailPage .StuffBuyTimingCard{grid-template-columns:150px minmax(0,1fr);gap:14px;padding:16px 14px;}
  .StuffDetailPage .StuffBuyTimingGauge{max-width:145px;}
  .StuffDetailPage .StuffBuyTimingGaugeFace{height:72px;}
  .StuffDetailPage .StuffBuyTimingGaugeFace:before{bottom:-68px;height:136px;}
  .StuffDetailPage .StuffBuyTimingGaugeInner{bottom:-50px;height:100px;}
  .StuffDetailPage .StuffBuyTimingFacts{grid-template-columns:1fr 1fr;}
  .StuffDetailPage .StuffBuyTimingFacts span:last-child{grid-column:1/-1;}
}
@media(max-width:575.98px){
  .StuffDetailPage .StuffBuyTimingCard{grid-template-columns:1fr;gap:13px;text-align:center;}
  .StuffDetailPage .StuffBuyTimingGauge{max-width:180px;}
  .StuffDetailPage .StuffBuyTimingGaugeFace{height:88px;}
  .StuffDetailPage .StuffBuyTimingGaugeFace:before{bottom:-84px;height:168px;}
  .StuffDetailPage .StuffBuyTimingGaugeInner{bottom:-61px;height:122px;}
  .StuffDetailPage .StuffBuyTimingContent>p{max-width:360px;margin-left:auto;margin-right:auto;}
  .StuffDetailPage .StuffBuyTimingFacts{text-align:left;}
  .StuffDetailPage .StuffBuyTimingDataNotice{justify-content:center;}
}

/* Stuff buy timing reliability layer */
.StuffBuyTimingReliability{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:10px 12px;border:1px solid #e6ebf1;border-radius:12px;background:#f8fafc;font-size:.72rem;color:#59677a}.StuffBuyTimingReliability span{display:flex;align-items:center;gap:6px}.StuffBuyTimingReliability strong{font-size:.8rem;color:#1f2937}.StuffBuyTimingReliability--caution{background:#fffaf0;border-color:#f4e4b8}.StuffBuyTimingReliability--caution strong{color:#9a6a12}.StuffBuyTimingReasons{margin-top:9px;font-size:.67rem;line-height:1.55;color:#8a6670}.StuffBuyTimingDataNotice+ .StuffBuyTimingReasons{padding:0 2px}@media(max-width:575.98px){.StuffBuyTimingReliability{padding:9px 10px}.StuffBuyTimingFacts span:last-child b{font-size:.7rem}}

/* Part detail buy timing gauge geometry fix - shared center-line alignment */
.StuffDetailPage .StuffBuyTimingGaugeFace{
  --StuffGaugeNeedleHeight:3px;
  --StuffGaugeHubSize:15px;
  --StuffGaugeHubBottom:0px;
}
.StuffDetailPage .StuffBuyTimingNeedle{
  height:var(--StuffGaugeNeedleHeight);
  bottom:calc(var(--StuffGaugeHubBottom) + (var(--StuffGaugeHubSize) - var(--StuffGaugeNeedleHeight)) / 2);
  transform-origin:100% 50%;
}
.StuffDetailPage .StuffBuyTimingNeedle span{
  left:0;
  top:50%;
  transform:translate(-50%,-50%);
}
.StuffDetailPage .StuffBuyTimingHub{
  width:var(--StuffGaugeHubSize);
  height:var(--StuffGaugeHubSize);
  bottom:var(--StuffGaugeHubBottom);
}