.guitar-detail-page {
  background: radial-gradient(circle at 75% -8%, rgba(172, 37, 53, .12), transparent 30rem), #08080b;
}
.guitar-detail-page .side-nav a.is-current::before { background: #f04455; box-shadow: 0 0 16px #f04455; }
.guitar-detail-page .side-nav a.is-current .nav-icon,
.guitar-detail-page .bottom-nav a.is-current { color: #f04455; }

.article-back { display: inline-flex; gap: 8px; margin-bottom: 23px; color: #8e8993; font-size: 10px; }
.article-back:hover { color: #fff; }
.article-hero { width: min(100%, 920px); margin: 0 auto; }
.article-hero__image { position: relative; height: clamp(310px, 43vw, 510px); overflow: hidden; border: 1px solid rgba(240,68,85,.28); }
.article-hero__image img { width: 100%; height: 100%; object-fit: cover; object-position: center 32%; filter: saturate(.65) contrast(1.06); }
.article-hero__image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(8,8,11,.76), transparent 46%); }
.article-hero__label { position: absolute; z-index: 1; top: 20px; left: 20px; border: 1px solid #f04455; background: rgba(8,8,11,.55); padding: 5px 8px; color: #f58b96; font-size: 8px; letter-spacing: .1em; }
.article-head { width: min(calc(100% - 48px), 720px); margin: -68px auto 0; position: relative; z-index: 2; border: 1px solid rgba(255,255,255,.12); background: #101015; padding: 34px 38px; }
.article-head__overline { margin-bottom: 13px; color: #f45462; font-family: "Bebas Neue", sans-serif; font-size: 12px; letter-spacing: .16em; }
.article-head h1 { margin-bottom: 16px; font-family: "Noto Sans JP", sans-serif; font-size: clamp(27px, 4vw, 42px); font-weight: 600; letter-spacing: .02em; line-height: 1.5; }
.article-head__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; color: #87828c; font-size: 9px; }
.article-actions { display: flex; gap: 7px; }
.article-actions button { border: 1px solid rgba(255,255,255,.17); background: transparent; padding: 7px 10px; color: #aaa5ae; cursor: pointer; font-size: 8px; }
.article-actions button.is-saved { border-color: rgba(240,68,85,.5); color: #f19aa3; }
.detail-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.detail-tags span { border: 1px solid rgba(255,255,255,.16); padding: 4px 7px; color: #99949e; font-size: 8px; }

.article-body { width: min(calc(100% - 48px), 690px); margin: 60px auto 0; }
.free-range { display: flex; align-items: center; gap: 12px; margin-bottom: 27px; color: #77727c; font-size: 8px; letter-spacing: .1em; }
.free-range::before, .free-range::after { content: ""; flex: 1; height: 1px; background: rgba(255,255,255,.1); }
.article-prose { color: #c9c4cc; font-size: 14px; line-height: 2.15; }
.article-prose p { margin-bottom: 2em; }
.article-prose h2 { margin: 58px 0 0; color: #f2eef3; font-size: 25px; line-height: 1.6; }
.article-prose h3,.article-prose h4{margin:38px 0 12px;color:#eee9ef;line-height:1.6}.article-prose ul,.article-prose ol{margin:0 0 2em;padding-left:1.6em}.article-prose li{margin:.45em 0}.article-prose blockquote{margin:2em 0;border-left:2px solid #f04455;padding:.2em 0 .2em 1.2em;color:#aaa3ad}.article-prose hr{margin:3em 0;border:0;border-top:1px solid rgba(255,255,255,.15)}.article-prose a{color:#ee8d97;text-decoration:underline;text-underline-offset:3px}.article-prose img{display:block;width:min(100%,760px);height:auto;margin:2em auto}.article-prose figure{margin:2em 0}
.members-boundary { margin-top: 26px; border: 1px solid rgba(240,68,85,.33); background: linear-gradient(135deg, rgba(136,36,51,.15), rgba(255,255,255,.018)); padding: 31px; text-align: center; }
.boundary-lock { display: inline-grid; width: 34px; height: 34px; place-items: center; margin-bottom: 15px; border: 1px solid rgba(240,68,85,.42); border-radius: 50%; color: #f2838e; font-size: 14px; }
.members-boundary h2 { margin-bottom: 10px; font-size: 18px; }
.members-boundary > p { margin-bottom: 18px; color: #9a959f; font-size: 10px; line-height: 1.9; }
.membership-button { display: inline-block; background: linear-gradient(100deg, #7138e8, #9838c8); padding: 12px 19px; color: #fff; font-size: 10px; font-weight: 700; }
.membership-note { margin: 11px 0 0 !important; color: #6f6a75 !important; font-size: 8px !important; }
.article-disclosure { margin-top: 13px; color: #77727c; text-align: center; font-size: 8px; }

.related { width: min(calc(100% - 48px), 920px); margin: 64px auto 0; border-top: 1px solid rgba(255,255,255,.1); padding-top: 28px; }
.related h2 { margin-bottom: 16px; font-family: "Bebas Neue", sans-serif; font-size: 29px; font-weight: 400; letter-spacing: .1em; }
.related-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.related-card { display: grid; grid-template-columns: 130px 1fr; min-height: 115px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); background: #111116; }
.related-card img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.55); }
.related-card div { padding: 15px; }
.related-card span { color: #d68790; font-size: 7px; }
.related-card h3 { margin: 8px 0 0; font-size: 12px; line-height: 1.55; }
.save-message { margin: 12px 0 0; color: #bd98ff; font-size: 9px; }

@media (max-width: 620px) {
  .article-back { margin-bottom: 17px; }
  .article-hero__image { height: 265px; }
  .article-hero__label { top: 12px; left: 12px; }
  .article-head { width: calc(100% - 24px); margin-top: -35px; padding: 21px 19px; }
  .article-head h1 { font-size: 25px; }
  .article-head__meta { display: block; }
  .article-actions { margin-top: 13px; }
  .article-body { width: calc(100% - 8px); margin-top: 43px; }
  .article-prose { font-size: 13px; line-height: 2; }
  .article-prose h2 { margin-top: 44px; font-size: 21px; }
  .members-boundary { padding: 26px 18px; }
  .related { width: 100%; margin-top: 52px; }
  .related-grid { grid-template-columns: 1fr; }
  .related-card { grid-template-columns: 112px 1fr; }
}

/* Readability pass */
.article-back,.article-head__overline,.article-head__meta,.members-boundary>p,.membership-button,.save-message{font-size:12px}.article-hero__label,.article-actions button,.detail-tags span,.free-range,.membership-note,.article-disclosure,.related-card span{font-size:11px!important}.related-card h3{font-size:14px}.article-prose{font-size:15px}.members-boundary h2{font-size:20px}