/* Personal reading and horology, sharing all three site palettes. */
.interests-head h1 { max-width: 850px; }
.interests-head .lead { max-width: 770px; }
.interest-section { padding-block: 30px 60px; scroll-margin-top: 26px; }
.interest-section + .interest-section { border-top: 1px solid var(--rule); padding-top: 65px; }
.interest-intro { display: grid; gap: 24px; margin-bottom: 36px; }
.interest-intro h2 { margin-top: 14px; font: 400 clamp(30px, 3.5vw, 43px)/1.15 var(--serif); letter-spacing: -.025em; }
.interest-intro > div:last-child { color: var(--muted); max-width: 720px; line-height: 1.85; }
.interest-intro strong { color: var(--ink); font-weight: 500; }
.interest-note { font-size: 12px; }
.manga-grid { display: grid; gap: 20px; }
.manga-card { position: relative; min-width: 0; padding: 27px; border: 1px solid var(--rule); background: var(--card); }
.manga-index { position: absolute; top: 20px; right: 24px; font: 400 28px/1 var(--serif); color: var(--rust); opacity: .65; }
.interest-tag { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: var(--accent); padding-right: 30px; }
.manga-card h3 { margin-block: 18px 7px; font: 400 27px/1.2 var(--serif); }
.manga-card .manga-creator { margin: 0 0 21px; font-size: 12px; color: var(--muted); }
.manga-card > p:not(.interest-tag):not(.manga-creator) { color: var(--muted); font-size: 14px; line-height: 1.9; }
.interest-source { display: inline-block; font-size: 11px; margin-top: 20px; text-decoration-thickness: 1px; }
.watch-comparison { overflow-x: auto; border: 1px solid var(--rule); background: var(--card); margin-bottom: 24px; }
.watch-comparison table { width: 100%; border-collapse: collapse; text-align: left; font-size: 13px; min-width: 590px; }
.watch-comparison caption { caption-side: top; padding: 19px 22px; text-align: left; color: var(--ink); font: 400 21px/1.35 var(--serif); border-bottom: 1px solid var(--rule); }
.watch-comparison th, .watch-comparison td { padding: 15px 22px; border-bottom: 1px solid var(--rule); }
.watch-comparison th { font-weight: 500; color: var(--ink); }
.watch-comparison thead th { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.watch-comparison td { color: var(--muted); }
.watch-comparison tr:last-child th, .watch-comparison tr:last-child td { border-bottom: 0; }
.watch-comparison tbody a { text-decoration: none; }
.watch-comparison tbody a:hover { text-decoration: underline; }
.watch-story { display: grid; gap: 24px; border-bottom: 1px solid var(--rule); padding-block: 38px; scroll-margin-top: 25px; }
.watch-story-heading h3 { font: 400 31px/1.25 var(--serif); margin-block: 13px 14px; }
.watch-story-heading > p:last-child { color: var(--muted); font-size: 14px; max-width: 260px; }
.watch-story-body { min-width: 0; }
.watch-story-body > p { color: var(--muted); font-size: 15px; line-height: 1.9; }
.watch-principles { display: grid; gap: 16px; margin: 0 0 25px; padding: 18px 20px; background: var(--card); border-left: 2px solid var(--accent); }
.watch-principles dt { color: var(--rust); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 5px; }
.watch-principles dd { margin: 0; color: var(--ink); font-size: 13px; }
.watch-story-body .watch-takeaway { color: var(--ink); margin-top: 20px; font-size: 14px; }
.watch-sync { margin-top: 35px; padding: 28px; border: 1px solid var(--rule); background: var(--card); }
.watch-sync h3 { font: 400 26px/1.3 var(--serif); margin-block: 12px 18px; }
.watch-sync > p:not(.eyebrow) { color: var(--muted); font-size: 14px; line-height: 1.85; max-width: 850px; }
.interests-close { padding-top: 0; }
@media(min-width: 650px) {
  .manga-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .watch-principles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
}
@media(min-width: 900px) {
  .interest-intro { grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr); gap: 70px; }
  .manga-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .watch-story { grid-template-columns: minmax(0, .7fr) minmax(0, 1.5fr); gap: 70px; padding-block: 45px; }
}
@media(max-width: 400px) {
  .manga-card, .watch-sync { padding: 22px; }
  .manga-index { right: 18px; }
}
@media print {
  .manga-card, .watch-story, .watch-sync { break-inside: avoid; }
  .watch-comparison { overflow: visible; }
}