/* 一覧専用。記事本文の書体と読み幅には適用しない。 */
body.translation-archive-page { --fg:#06131f; --heading:#06131f; --bg:#f8f7f2; --muted:#4b5563; --accent:#0b63ce; --accent-strong:#0b63ce; --border:#cbd3d9; font-family:HelveticaNeue,"Helvetica Neue",Helvetica,Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic",YuGothic,Meiryo,sans-serif; }
.translation-archive-page * { box-sizing:border-box; }
.translation-archive-page main,.translation-archive-page footer { max-width:1040px; padding-inline:clamp(20px,4vw,40px); }
.translation-archive-page main { margin:0 auto; padding-top:44px; padding-bottom:48px; }
.translation-archive-page h1,.translation-archive-page h2,.translation-archive-page h3 { font-family:inherit; font-weight:700; letter-spacing:-.025em; }
.translation-archive-page h1 { margin:10px 0 14px; font-size:clamp(28px,4vw,42px); line-height:1.3; }
.translation-archive-page a { color:inherit; text-underline-offset:4px; }
.translation-archive-page a:hover { color:var(--accent); }
.catalogue-intro { padding-bottom:30px; border-bottom:1px solid var(--border); }
.catalogue-eyebrow,.catalogue-topic { font-family:"SF Mono",Menlo,Consolas,monospace; font-size:12px; font-weight:700; letter-spacing:.08em; color:var(--accent); }
.catalogue-intro p { margin:0; }
.catalogue-intro > p:not(.catalogue-eyebrow) { color:var(--muted); font-size:15px; }
.catalogue-shortcuts { display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:18px; font-size:14px; }
.catalogue-section-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin:28px 0 14px; }
.catalogue-section-head h2 { font-size:22px; margin:0; border:0; padding:0; }
.catalogue-section-head > span { color:var(--muted); font-size:13px; white-space:nowrap; }
.catalogue-search { display:flex; width:100%; max-width:620px; margin:0; }
.catalogue-search input { min-width:0; flex:1; width:100%; border:1px solid var(--border); border-right:0; border-radius:0; padding:11px 14px; font:inherit; font-size:16px; color:var(--fg); background:#fff; }
.catalogue-search button { flex:none; border:1px solid var(--fg); background:var(--fg); color:#fff; padding:10px 22px; font:inherit; min-height:46px; cursor:pointer; }
.catalogue-topics { display:flex; flex-wrap:wrap; gap:4px 18px; padding:10px 0; }
.catalogue-topics a { min-height:40px; display:inline-flex; align-items:center; font-size:14px; text-decoration:none; border-bottom:2px solid transparent; }
.catalogue-topics a[aria-current] { color:var(--accent); border-bottom-color:currentColor; font-weight:700; }
.catalogue-order,.catalogue-filter-status { color:var(--muted); font-size:13px; margin:4px 0 14px; }
.catalogue-filter-status a { margin-left:14px; }
.catalogue-list { padding:0; margin:0; list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.catalogue-row { min-width:0; position:relative; display:flex; flex-direction:column; border:1px solid var(--border); background:#fff; border-radius:8px; overflow:hidden; transition:border-color .15s ease; }
.catalogue-row:hover { border-color:var(--accent); }
.catalogue-article { display:grid; grid-template-columns:36% minmax(0,1fr); align-items:start; flex:1; text-decoration:none; }
.catalogue-card-body { padding:12px 14px 4px; }
.catalogue-article h3 { margin:5px 0 7px; font-size:16px; line-height:1.55; overflow-wrap:anywhere; }
.catalogue-summary { color:var(--muted); font-size:12px; line-height:1.6; margin:0 0 7px; }
.catalogue-meta { color:var(--muted); font-size:12px; line-height:1.7; margin:0; overflow-wrap:anywhere; }
.catalogue-original { white-space:nowrap; min-height:44px; display:flex; align-items:center; justify-content:flex-end; gap:6px; margin:0 14px 4px; font-size:12px; }
#articles,#translated-sites { scroll-margin-top:24px; }
#translated-sites { margin-top:48px; }
.catalogue-site-description { margin:0 0 20px; color:var(--muted); font-size:14px; }
.catalogue-sites { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 32px; }
.catalogue-site { border-top:1px solid var(--border); padding:20px 0; }
.catalogue-site-main { display:block; text-decoration:none; }
.catalogue-site h3 { margin:0 0 10px; font-size:20px; line-height:1.55; }
.catalogue-site p { margin:0; font-size:14px; color:var(--muted); line-height:1.8; }
.catalogue-site-tools { display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:14px; font-size:13px; }
.catalogue-related { border-top:1px solid var(--border); margin-top:32px; padding-top:20px; display:flex; flex-wrap:wrap; gap:10px 24px; font-size:14px; }
.catalogue-related > span { color:var(--muted); }
.catalogue-empty { border-block:1px solid var(--border); padding:32px 0; }
.catalogue-empty h3 { font-size:20px; margin:0; }
@media(max-width:640px) {
 .translation-archive-page main { padding-top:28px; }
 .catalogue-intro { padding-bottom:22px; }
 .catalogue-shortcuts { gap:8px 16px; }
 .catalogue-section-head { margin-top:22px; }
 .catalogue-card-body { padding:12px 12px 4px; }
 .catalogue-article h3 { font-size:16px; }
 .catalogue-list { grid-template-columns:1fr; gap:14px; }
 .catalogue-sites { grid-template-columns:1fr; }
 .catalogue-topics { gap:2px 16px; }
 .catalogue-search button { padding-inline:18px; }
}

.catalogue-formats { display:grid; align-items:start; grid-template-columns:1fr 1.4fr; gap:24px; margin:24px 0 28px; }
.catalogue-format-links { display:grid; gap:12px; }
.catalogue-format-links > a { display:block; text-decoration:none; padding:12px 16px; border:1px solid var(--border); background:#fff; }
.catalogue-format-links > a:hover { border-color:var(--accent); }
.catalogue-format-links span { font-size:10px; letter-spacing:.09em; color:var(--accent); }
.catalogue-format-links strong { display:block; margin-top:4px; font-size:18px; }
.catalogue-formats small { font-size:12px; font-weight:400; color:var(--muted); }
.catalogue-video-heading { display:flex; align-items:center; justify-content:space-between; font-size:18px; font-weight:700; text-decoration:none; margin-bottom:10px; }
.catalogue-featured-video { display:grid; grid-template-columns:45% minmax(0,1fr); gap:14px; text-decoration:none; }
.catalogue-video-image { position:relative; display:grid; place-items:center; aspect-ratio:16/9; background:#10202f; overflow:hidden; border-radius:4px; }
.catalogue-video-image img { position:absolute; width:100%; height:100%; object-fit:contain; margin:0; }
.catalogue-play { position:relative; display:grid; place-items:center; width:44px; height:44px; padding-left:3px; border:1px solid #ffffffb3; border-radius:50%; background:#06131fcc; color:white; font-size:19px; }
.catalogue-video-copy strong { display:block; font-size:15px; line-height:1.55; }
.catalogue-video-copy small { display:block; margin-top:6px; font-size:11px; }
.catalogue-video-copy > span { display:block; margin-top:8px; font-size:12px; color:var(--accent); }
.catalogue-format-filter { border-bottom:1px solid var(--border); margin-top:14px; }
.catalogue-group { margin-top:30px; }
.catalogue-group + .catalogue-group { margin-top:44px; }
.catalogue-external { font-size:14px; color:var(--muted); }
.translation-archive-page a:focus-visible,.translation-archive-page button:focus-visible,.translation-archive-page input:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
@media(max-width:760px) {
 .catalogue-formats { grid-template-columns:1fr; gap:18px; margin:20px 0; }
 .catalogue-format-links { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .catalogue-format-links > a { padding:10px 12px; }
 .catalogue-format-links strong { font-size:16px; }
 .catalogue-format-links small { display:block; margin-top:3px; }
}

.catalogue-thumbnail { position:relative; aspect-ratio:16/9; overflow:hidden; background:#edf0f2; margin:12px 0 0 12px; border-radius:3px; }
.catalogue-thumbnail img { display:block; width:100%; height:100%; object-fit:contain; margin:0; }
.catalogue-media-label { display:inline-block; margin-right:8px; padding:3px 7px; border-radius:3px; background:#edf0f2; color:var(--muted); font-size:11px; line-height:1.3; }
.catalogue-thumbnail-empty { display:grid; place-items:center; background:linear-gradient(135deg,#eef2f6,#f8f7f2); }
.catalogue-placeholder { text-align:center; color:#52687c; letter-spacing:.12em; font-size:24px; line-height:1.3; font-weight:700; }
.catalogue-placeholder small { font-size:10px; letter-spacing:.2em; }

.translation-archive-page main .catalogue-player { display:block; width:100%; aspect-ratio:16/9; height:auto; margin:0; border-radius:4px; background:#10202f; }
.catalogue-featured-video { grid-template-columns:1fr; }
.catalogue-video-copy { text-decoration:none; }
.catalogue-video-row .catalogue-article { display:block; }
.catalogue-video-row .catalogue-player { border-radius:0; }

.translation-archive-page main .catalogue-youtube { border:0; min-height:200px; }
.translation-archive-page main .catalogue-x { border:0; aspect-ratio:auto; width:100%; max-width:550px; height:720px; margin:0 auto; background:#fff; }
