.story-detail{min-height:calc(100vh - 70px);background:#fff;color:#1a1a1a}
.story-detail>.front-detail-utility{padding:10px 16px}
.story-detail__hero>img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.story-detail__article{padding:18px 16px}
.story-detail__tags{display:flex;flex-wrap:wrap;gap:6px}
.story-detail__tag{display:inline-block;padding:4px 10px;border-radius:7px;background:#fce4f1;color:#e6007e;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.story-detail__article h1{margin:12px 0 0;font-size:24px;font-weight:800;letter-spacing:-.5px;line-height:1.2}
.story-detail__author{margin:7px 0 0;color:#767676;font-size:12px}
.story-detail__paragraph{margin:16px 0 0;color:#2b2b2b;font-size:14.5px;line-height:1.7;white-space:pre-line}
.story-detail__inline-image{display:block;width:100%;margin-top:16px;aspect-ratio:16/10;border-radius:14px;object-fit:cover}
.story-commerce-card{display:grid;grid-template-rows:auto 1fr auto;min-height:202px;margin-top:18px;padding:14px;border:1.5px solid #e6007e;border-radius:16px;background:#fff4fa}
.story-commerce-card__eyebrow{overflow:hidden;margin:0;color:#e6007e;font-size:11px;font-weight:800;letter-spacing:.6px;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}
.story-commerce-card__summary{display:flex;min-width:0;gap:12px;margin-top:10px;color:#1a1a1a;text-decoration:none}
.story-commerce-card__media{display:block;width:66px;height:66px;flex:0 0 auto}
.story-commerce-card__media>img,.story-commerce-card__media-placeholder{display:grid;width:100%;height:100%;border-radius:11px;object-fit:cover;place-items:center}
.story-commerce-card__media-placeholder{background:#fce4f1;color:#e6007e}
.story-commerce-card__media-placeholder .material-symbols-outlined{font-size:30px}
.story-commerce-card__copy{display:flex;min-width:0;flex:1;flex-direction:column}
.story-commerce-card__kind{display:flex;align-items:center;gap:3px;color:#e6007e;font-size:11px;font-weight:700}
.story-commerce-card__kind .material-symbols-outlined{font-size:14px}
.story-commerce-card__kind>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.story-commerce-card__copy>strong{display:-webkit-box;overflow:hidden;min-height:2.6em;margin-top:3px;font-size:14px;line-height:1.3;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.story-commerce-card__meta{overflow:hidden;min-height:23px;white-space:nowrap}
.story-commerce-card__prices{display:flex;align-items:baseline;gap:6px;margin-top:4px}
.story-commerce-card__prices b{color:#e6007e;font-size:15px}
.story-commerce-card__prices s{color:#ababab;font-size:11px}
.story-commerce-card__prices em{padding:2px 6px;border-radius:6px;background:#fce4f1;color:#e6007e;font-size:10px;font-style:normal;font-weight:800}
.story-commerce-card__coupon-meta{display:flex;align-items:center;gap:7px;margin-top:5px;color:#767676;font-size:11.5px;font-weight:600}
.story-commerce-card__coupon-meta b{padding:3px 8px;border-radius:7px;background:#e6007e;color:#fff;font-size:11px}
.story-commerce-card__cta{display:flex;min-height:42px;align-items:center;justify-content:center;margin-top:12px;padding:0 14px;border-radius:12px;background:#e6007e;color:#fff;font-size:14px;font-weight:700;text-decoration:none}
.story-related h2,.story-mentioned h2{margin:24px 0 12px;font-size:17px;font-weight:800}
.story-related__rail{display:flex;align-items:stretch;gap:12px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.story-related__rail::-webkit-scrollbar{display:none}
.story-related__card{flex:0 0 min(210px,64vw);color:#1a1a1a;text-decoration:none}
.story-related__card img{display:block;width:100%;aspect-ratio:1/1;border-radius:13px;box-shadow:0 3px 9px rgb(0 0 0/10%);object-fit:cover}
.story-related__card strong{display:-webkit-box;overflow:hidden;min-height:2.6em;margin-top:7px;font-size:13.5px;line-height:1.3;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.story-related__more{display:flex;flex:0 0 96px;flex-direction:column;align-items:center;justify-content:center;gap:9px;border:1.5px dashed #e6007e;border-radius:13px;background:#fff4fa;color:#e6007e;text-decoration:none}
.story-related__plus{display:grid;width:38px;height:38px;border-radius:50%;background:#e6007e;color:#fff;place-items:center}
.story-related__more strong{font-size:13px}.story-related__more>span:last-child{color:#767676;font-size:10.5px;font-weight:600}
.story-mentioned__list{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.story-commerce-card--related{min-width:0;min-height:0;margin-top:0}
.story-detail a:focus-visible{outline:2px solid #e6007e;outline-offset:3px}
.story-commerce-card__cta:active{transform:scale(.98)}
@media(prefers-reduced-motion:reduce){.story-commerce-card__cta:active{transform:none}}
@media(max-width:340px){.story-detail__article{padding-right:12px;padding-left:12px}.story-commerce-card__summary{gap:9px}.story-commerce-card__media{width:58px;height:58px}}

@media(min-width:1024px){
  .story-detail{box-sizing:border-box;width:min(100% - 48px,1200px);margin:0 auto;padding:20px 0 96px}
  .story-detail>.front-detail-utility{padding:0 0 14px}
  .story-detail__hero{overflow:hidden;border-radius:32px;background:#f6f6f7;box-shadow:0 24px 70px rgb(230 0 126/10%)}
  .story-detail__hero>img{aspect-ratio:21/9;max-height:520px}
  .story-detail__article{box-sizing:border-box;max-width:820px;margin:0 auto;padding:46px 0 0}
  .story-detail__tag{padding:6px 12px;border-radius:999px;font-size:12px}
  .story-detail__article h1{max-width:760px;margin-top:16px;font-size:46px;letter-spacing:-1.6px;line-height:1.08}
  .story-detail__author{margin-top:12px;font-size:14px}
  .story-detail__paragraph{margin-top:24px;font-size:18px;line-height:1.85}
  .story-detail__inline-image{width:100%;max-width:100%;margin:32px 0 0;border-radius:32px}
  .story-commerce-card{grid-template-columns:minmax(0,1fr) max-content;grid-template-rows:auto 1fr;grid-template-areas:"eyebrow cta" "summary cta";min-height:158px;margin-top:32px;padding:22px;border-color:#f1d6e5;border-radius:22px;background:#fff;box-shadow:0 18px 48px rgb(230 0 126/8%);column-gap:22px}
  .story-commerce-card__eyebrow{grid-area:eyebrow}
  .story-commerce-card__summary{grid-area:summary;align-items:center;min-width:0;gap:18px}
  .story-commerce-card__cta{grid-area:cta;width:max-content;min-width:180px;min-height:48px;align-self:center;margin-top:0;padding:0 20px;border-radius:14px;font-size:15px;white-space:nowrap}
  .story-commerce-card__media{width:112px;height:112px}
  .story-commerce-card__media>img,.story-commerce-card__media-placeholder{border-radius:18px}
  .story-commerce-card__copy>strong{min-height:2.5em;font-size:20px;line-height:1.25}
  .story-commerce-card__prices b{font-size:18px}
  .story-related h2,.story-mentioned h2{margin:40px 0 16px;font-size:22px}
  .story-related__rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(120px,.55fr);gap:16px;overflow:visible}
  .story-related__card{min-width:0;flex:initial}
  .story-related__card img{border-radius:20px}
  .story-related__card strong{margin-top:10px;font-size:15px}
  .story-related__more{flex:initial;min-height:100%;border-radius:20px}
  .story-mentioned__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
  .story-commerce-card--related{align-content:start;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;grid-template-areas:"eyebrow" "summary" "cta";min-height:0;margin-top:0;padding:16px;border-radius:20px}
  .story-commerce-card--related .story-commerce-card__summary{align-items:flex-start;gap:12px}
  .story-commerce-card--related .story-commerce-card__media{width:72px;height:72px}
  .story-commerce-card--related .story-commerce-card__copy>strong{min-height:2.7em;font-size:14.5px;line-height:1.35}
  .story-commerce-card--related .story-commerce-card__cta{width:100%;min-width:0;min-height:44px;margin-top:12px}
}
@media(min-width:1024px) and (max-width:1120px){
  .story-detail{width:min(100% - 32px,1200px)}
  .story-detail__article{max-width:760px}
  .story-detail__article h1{font-size:40px}
  .story-detail__inline-image{width:100%;max-width:100%;margin-left:0}
  .story-related__rail{grid-template-columns:repeat(3,minmax(0,1fr))}
  .story-related__more{min-height:150px}
}
