:root{
  --bg:#F8F9FA; --surface:#FFFFFF; --surface2:#EEF2F4; --line:#D8DFE4; --line2:#E9EEF1;
  --ink:#17222C; --ink2:#4F5F6C; --ink3:#7E8C97;
  --accent:#0B5D6B; --accent-ink:#FFFFFF; --accent-soft:#DDEEF0;
  --bar:#8FC3CA;
  --q1:#1B7F5A; --q1s:#DFF3EA; --q2:#2E67A6; --q2s:#DEE9F6; --q3:#A66E14; --q3s:#F8EBD2; --q4:#9B4A4A; --q4s:#F6E1E1;
  --warn:#A66E14; --warn-s:#F8EBD2;
  --serif:"Newsreader",Georgia,"Times New Roman","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"IBM Plex Sans","Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#0F1418; --surface:#161C22; --surface2:#1E262E; --line:#2C3740; --line2:#232C34;
    --ink:#E6EBEF; --ink2:#AAB6C0; --ink3:#7D8A95;
    --accent:#6FC1CC; --accent-ink:#0F1418; --accent-soft:#173A40;
    --bar:#2F6E77;
    --q1:#5FCF9C; --q1s:#163A2C; --q2:#7FB0E8; --q2s:#1B2F47; --q3:#E0A94A; --q3s:#3D2E12; --q4:#E08A8A; --q4s:#3F2222;
    --warn:#E0A94A; --warn-s:#3D2E12;
  }
}
*{box-sizing:border-box}
html{color-scheme:light dark}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.7}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button,input,select{font:inherit;color:inherit}

/* header */
header.top{border-bottom:1px solid var(--line);background:var(--surface)}
.top-in{max-width:1240px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.brand{text-decoration:none;color:var(--ink)}
.brand b{font-family:var(--serif);font-weight:500;font-size:24px;letter-spacing:-.01em}
.brand b span{color:var(--accent)}
.brand small{display:block;color:var(--ink3);font-size:12px;margin-top:-2px}
nav.site ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap}
nav.site a{text-decoration:none;color:var(--ink2);padding:6px 12px;border-radius:6px;font-size:14px}
nav.site a:hover{background:var(--surface2);color:var(--ink)}
nav.site a[aria-current="page"]{background:var(--accent-soft);color:var(--ink);font-weight:500}

/* layout */
.wrap{max-width:1240px;margin:0 auto;padding:20px 24px 48px}
.wrap.nav-layout{display:grid;grid-template-columns:230px 1fr;gap:28px}
.wrap.article-layout{display:grid;grid-template-columns:minmax(0,720px) 300px;gap:40px;justify-content:center}
@media (max-width:980px){.wrap.article-layout{grid-template-columns:1fr}}
@media (max-width:820px){.wrap.nav-layout{grid-template-columns:1fr;gap:16px}}

/* ad slots — hidden until ADS_ENABLED is set in assets/site.js */
.ad{display:none;margin:20px 0;text-align:center;min-height:90px}
body.ads-on .ad{display:block}
.ad-side{position:sticky;top:16px}

/* category rail */
nav.rail{position:sticky;top:16px;align-self:start;max-height:calc(100vh - 32px);overflow-y:auto;overscroll-behavior:contain;padding-right:6px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
nav.rail::-webkit-scrollbar{width:8px}
nav.rail::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
nav.rail::-webkit-scrollbar-track{background:transparent}
@media (max-width:820px){nav.rail{position:static;max-height:none;overflow:visible;padding-right:0}}
.rail h2{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin:14px 0 6px;font-weight:600}
.rail h2:first-child{margin-top:0}
.rail ul{list-style:none;margin:0;padding:0}
.rail li button{width:100%;text-align:left;background:none;border:0;border-left:2px solid transparent;padding:6px 10px;border-radius:0 6px 6px 0;cursor:pointer;display:flex;justify-content:space-between;gap:8px;color:var(--ink2);font-size:14px}
.rail li button:hover{background:var(--surface2);color:var(--ink)}
.rail li button[aria-current="true"]{border-left-color:var(--accent);background:var(--accent-soft);color:var(--ink);font-weight:500}
.rail li button .n{font-family:var(--mono);font-size:11px;color:var(--ink3)}
@media (max-width:820px){.rail ul{display:flex;flex-wrap:wrap;gap:4px}.rail li button{border:1px solid var(--line);border-radius:999px;padding:4px 10px}.rail li button[aria-current="true"]{border-color:var(--accent)}}

/* navigator */
main{min-width:0}
.edition{font-family:var(--mono);font-size:12px;color:var(--ink2);line-height:1.6;margin-bottom:10px}
.edition b{color:var(--ink);font-weight:500}
.cat-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.cat-head h1{font-family:var(--serif);font-weight:500;font-size:26px;margin:0;letter-spacing:-.01em}
.cat-head .sub{color:var(--ink2);font-size:13px}
.cat-head .sub em{font-style:normal;font-family:var(--mono);font-size:12px}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.toolbar input[type=search]{flex:1 1 240px;min-width:180px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.toolbar select{padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.chk{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);cursor:pointer;user-select:none;color:var(--ink2)}
.chk input{accent-color:var(--accent);margin:0}
.chk:has(input:checked){border-color:var(--accent);color:var(--ink);background:var(--accent-soft)}
.tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:10px}
table.jl{width:100%;border-collapse:collapse;min-width:720px;font-size:14px}
table.jl th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);font-weight:600;text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--surface)}
table.jl th.num,table.jl td.num{text-align:right;font-variant-numeric:tabular-nums}
table.jl td{padding:9px 12px;border-bottom:1px solid var(--line2);vertical-align:middle}
table.jl tr:last-child td{border-bottom:0}
table.jl tbody tr:hover td{background:var(--surface2)}
td.rank{font-family:var(--mono);color:var(--ink3);width:44px;text-align:right}
td.name{font-weight:500}
td.name .cats{display:block;font-weight:400;font-size:11px;color:var(--ink3);margin-top:2px}
td.pub{color:var(--ink2);font-size:13px}
td.if{width:190px}
.ifcell{display:flex;align-items:center;gap:10px}
.ifcell .v{font-family:var(--mono);font-size:14px;font-weight:500;min-width:44px;text-align:right}
.ifcell .bar{flex:1;height:6px;background:var(--surface2);border-radius:3px;overflow:hidden}
.ifcell .bar i{display:block;height:100%;background:var(--bar);border-radius:3px}
.ifcell .v.na{color:var(--ink3);font-weight:400}
.pill{display:inline-block;font-family:var(--mono);font-size:11px;padding:2px 7px;border-radius:999px;line-height:1.5}
.q1{background:var(--q1s);color:var(--q1)} .q2{background:var(--q2s);color:var(--q2)} .q3{background:var(--q3s);color:var(--q3)} .q4{background:var(--q4s);color:var(--q4)}
.qn{color:var(--ink3);font-family:var(--mono);font-size:11px}
.oa{font-family:var(--mono);font-size:11px;color:var(--accent);border:1px solid currentColor;border-radius:4px;padding:0 5px}
.yr{font-family:var(--mono);font-size:11px;color:var(--warn);background:var(--warn-s);padding:1px 6px;border-radius:4px;margin-left:6px;white-space:nowrap}
td.src a{font-size:12px;color:var(--ink3);text-decoration:none}
td.src a:hover{color:var(--accent);text-decoration:underline}
.empty{padding:28px;text-align:center;color:var(--ink3)}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;color:var(--ink3);font-size:12px;align-items:center}

/* articles */
article.post{max-width:72ch}
article.post h1{font-family:var(--serif);font-weight:500;font-size:30px;line-height:1.3;margin:0 0 6px;letter-spacing:-.01em;text-wrap:balance}
article.post .meta{color:var(--ink3);font-size:13px;margin-bottom:24px;font-family:var(--mono)}
article.post h2{font-family:var(--serif);font-weight:500;font-size:22px;margin:36px 0 10px;letter-spacing:-.01em}
article.post h3{font-size:16px;margin:24px 0 6px}
article.post p{margin:0 0 14px}
article.post ul,article.post ol{padding-left:1.4em;margin:0 0 14px}
article.post li{margin-bottom:4px}
article.post table{border-collapse:collapse;width:100%;font-size:14px;margin:0 0 16px}
article.post th,article.post td{border-bottom:1px solid var(--line2);padding:8px 10px;text-align:left;vertical-align:top}
article.post th{font-size:12px;color:var(--ink3);letter-spacing:.06em;text-transform:uppercase}
article.post .callout{background:var(--accent-soft);border-left:3px solid var(--accent);padding:12px 16px;border-radius:0 8px 8px 0;margin:0 0 16px}
article.post .callout p:last-child{margin:0}
.lead{font-size:17px;color:var(--ink2)}
aside.side h2{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin:0 0 8px;font-weight:600}
aside.side ul{list-style:none;padding:0;margin:0 0 24px}
aside.side li{padding:6px 0;border-bottom:1px solid var(--line2)}
aside.side a{text-decoration:none;color:var(--ink)}
aside.side a:hover{color:var(--accent)}

/* article index */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:6px}
.card:hover{border-color:var(--accent)}
.card h3{margin:0;font-family:var(--serif);font-weight:500;font-size:19px;line-height:1.35}
.card p{margin:0;color:var(--ink2);font-size:14px}
.card small{color:var(--ink3);font-family:var(--mono);font-size:11px}
.page h1{font-family:var(--serif);font-weight:500;font-size:30px;margin:0 0 16px}

footer.site{border-top:1px solid var(--line);margin-top:24px}
.foot-in{max-width:1240px;margin:0 auto;padding:22px 24px 32px;color:var(--ink3);font-size:12px;line-height:1.7;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot-in p{margin:0 0 6px;max-width:72ch}
.foot-in nav a{color:var(--ink3);margin-right:14px;text-decoration:none}
.foot-in nav a:hover{color:var(--accent)}

/* 表の本文セルは中央揃え（見出しは左のまま） */
table.jl td{text-align:center}
table.jl td.rank{text-align:center}
table.jl td.num{text-align:center}
table.jl td.name .cats{text-align:center}
.ifcell{justify-content:center}
tr.detail td{text-align:left}
td.note{text-align:center}

/* 診療科別ページ */
.fieldlinks{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px}
.fieldlinks a{display:block;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);text-decoration:none;color:var(--ink);font-size:14px}
.fieldlinks a:hover{border-color:var(--accent);color:var(--accent)}
.fieldnav{margin:28px 0 8px}
.fieldnav h2,.page h2{font-family:var(--serif);font-weight:500;font-size:20px;margin:26px 0 10px}
.toplist{padding-left:1.3em;margin:0 0 18px;font-size:14px}
.toplist li{padding:3px 0}
.toplist a{text-decoration:none;font-weight:500}
.toplist a:hover{text-decoration:underline}

/* 雑誌ページのリンクバー */
.linkbar{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 20px}
.lb{display:inline-block;padding:7px 14px;border:1px solid var(--line);border-radius:999px;
    background:var(--surface);text-decoration:none;color:var(--ink);font-size:13.5px;white-space:nowrap}
.lb:hover{border-color:var(--accent);color:var(--accent)}
.lb-key{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.lb-key:hover{opacity:.88;color:var(--accent-ink)}
td.src{white-space:nowrap;width:1%}
td.src a{font-size:12.5px;white-space:nowrap}
table.jl td.pub{white-space:normal}
