﻿/* Work page layout 窶・reuses production colors from style.css; mobile-first */
.work-page .work-main{padding:16px 16px 32px;max-width:720px;margin:0 auto}
.work-article{display:flex;flex-direction:column;gap:10px}
.work-cover{display:block;width:100%;height:auto;max-width:480px;margin:0 auto;border-radius:8px;border:1px solid #dde4da}
.work-cover-empty{min-height:120px;background:transparent}
.work-title{font-size:clamp(20px,5vw,28px);line-height:1.45;margin:8px 0 0;font-weight:650;letter-spacing:.02em}
.work-article .circle{margin:0;font-size:14px;color:#687969}
.work-article .meta{margin:0;font-size:13px;color:#718073}
.work-article .tags{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 0;padding:0;list-style:none}
.work-article .tag{font-size:12px;background:none;border:1px solid #ccc;border-radius:4px;padding:2px 7px;color:#444}
.work-article .work-links{display:flex;flex-wrap:nowrap;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid #e3e3e3}
.work-article .work-links a{flex:1 1 0;min-width:0;text-align:center}
.work-tracks,.work-keywords{margin-top:18px;padding-top:14px;border-top:1px solid #e7ece3}
.work-tracks h2,.work-keywords h2{font-size:16px;margin:0 0 10px}
.track-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.work-track{background:#fff;border:1px solid #e3e9df;border-radius:8px;padding:10px 12px}
.track-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.track-title{font-size:14px;font-weight:600;line-height:1.45}
.track-dur{flex:none;font-size:12px;color:#69766c;font-variant-numeric:tabular-nums}
.track-kw,.kw-list{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:8px 0 0;padding:0}
.track-kw li,.kw-list li{display:inline-flex;align-items:baseline;gap:4px;font-size:12px;background:none;border:1px solid #ccc;border-radius:4px;padding:2px 7px;color:#444}
.kw-term{color:#23382f}.kw-count{font-weight:650;font-variant-numeric:tabular-nums;color:#3f5a44}
.work-back{margin:24px 0 0;font-size:14px}
.work-back .text-link{color:#23382f}
.muted{font-size:13px;color:#687969}
html.age-locked{overflow:hidden}
@media(min-width:601px){
  .work-page .work-main{padding:24px 32px 40px}
  .work-cover{max-width:360px;margin:0}
}

.related-works{margin-top:18px;padding-top:14px;border-top:1px solid #e7ece3}
.related-works h2{font-size:16px;margin:0 0 10px}
.related-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.related-link{display:flex;flex-direction:column;gap:6px;color:inherit;text-decoration:none}
.related-link:hover .related-title,.related-link:focus-visible .related-title{text-decoration:underline;text-underline-offset:2px}
.related-cover{display:block;width:100%;height:auto;border-radius:6px;border:1px solid #dde4da}
.related-cover-empty{min-height:80px;background:transparent;border:1px dashed #ddd;border-radius:6px}
.related-title{font-size:13px;line-height:1.4;font-weight:600}
@media(min-width:601px){.related-list{grid-template-columns:repeat(3,minmax(0,1fr))}}

