:root { color-scheme: light; --ink: #212529; --muted: #6c757d; --line: #dee2e6; --blue: #0d6efd; --pale: #f8f9fa; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font: 16px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
a { color: var(--blue); }
.site-header { background: #fff; color: var(--ink); }
.header-inner { max-width: 1140px; margin: auto; padding: .7rem 1rem; display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.site-header a { color: var(--blue); text-decoration: none; }
.brand { font-size: 1.05rem; font-weight: 700; }
.brand span { font-size: .8rem; font-weight: 400; opacity: .8; }
.site-header nav { display: flex; gap: 1.3rem; font-size: .85rem; }
.site-header nav a:hover { text-decoration: underline; }
main { min-width: 0; padding: 1rem 0 4rem; }
.intro { margin-bottom: 1.4rem; }
.eyebrow { text-transform: uppercase; letter-spacing: .1em; color: var(--blue); font-size: .75rem; font-weight: 700; }
.intro h1 { line-height: 1.2; margin: .4rem 0 1rem; font-size: clamp(1.6rem, 2.5vw, 2.4rem); }
.subtitle-translation { margin: -.7rem 0 1rem; font-size: clamp(1.1rem, 1.8vw, 1.6rem); }
.metadata { display: flex; gap: .6rem 1.5rem; flex-wrap: wrap; color: var(--muted); font-size: .82rem; margin: 1rem 0; }
.pair { scroll-margin-top: 1rem; }
.pair > div { min-width: 0; padding: .65rem 1rem; overflow-wrap: anywhere; }
.pair > .japanese { border-left: 0; background: transparent; }
.pair p, .pair h2, .pair h3, .pair h4, .pair h5 { margin: .25rem 0; }
.pair h2 { font-size: 1.55rem; }.pair h3 { font-size: 1.3rem; }.pair h4 { font-size: 1.12rem; }.pair h5 { font-size: 1rem; }
.pair.heading { margin-top: 1.2rem; }
.list-line { display: flex; align-items: baseline; gap: .45em; }
.list-marker { flex: 0 0 auto; min-width: 1.5em; color: var(--blue); text-align: right; white-space: nowrap; }
.list-body { flex: 1 1 auto; min-width: 0; }
.pair.list_item.depth-1 { margin-left: 1.5rem; }.pair.list_item.depth-2 { margin-left: 3rem; }
.pair.note { background: transparent; border-left: 0; }
.pair.definition_term { background: transparent; font-weight: 700; }
.pending { color: #8995a0; font-style: italic; font-size: .9rem; }
.withheld-mark { color: #5f6b76; font-size: .9rem; }
.pdf-notice { padding: .65rem .8rem; border-left: 3px solid var(--blue); background: var(--pale); font-size: .9rem; }
.source-ref { margin-top: .35rem; font-size: .75rem; color: var(--muted); }
.source-image { margin-top: .45rem; font-size: .8rem; }
.table-image { margin: 0; }
.table-image img { display: block; max-width: 100%; height: auto; }
.table-image figcaption { color: #5f6b76; font-size: .8rem; margin-top: .3rem; }
.source-image img { display: block; max-width: 100%; height: auto; margin-top: .45rem; }
.pair.table .english, .pair.table .japanese { overflow-x: auto; }
.pair.math .english, .pair.math .japanese { overflow-x: auto; }
.pair.math.math-result-table td:last-child { white-space: nowrap; }
.math-content { max-width: 100%; overflow-x: auto; }
.math-content .katex-display { margin: .3rem 0; overflow-x: auto; overflow-y: hidden; }
.math-content .katex { font-size: .96em; }
.draft-badge { display: inline-block; margin-top: .25rem; color: #755111; background: #fff3d9; padding: 0 .4rem; border-radius: 3px; font-size: .7rem; }
.source-only { padding: 1rem 0; overflow-x: auto; }
.block-label { color: var(--muted); font-size: .75rem; font-weight: 700; margin-bottom: .4rem; }
.source-only table, .pair table { border-collapse: collapse; font-size: .85rem; width: 100%; min-width: 0; }
.source-only th, .source-only td, .pair th, .pair td { border: 1px solid var(--line); padding: .45rem .55rem; vertical-align: top; }
.source-only th, .pair th { background: transparent; }
.source-only caption, .pair caption { text-align: left; font-weight: 700; margin-bottom: .5rem; }
.source-only img { max-width: 100%; height: auto; }
.preserved-source { margin: .7rem 0; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: 4px; scroll-margin-top: 1rem; }
.preserved-label { margin-bottom: .6rem; font-size: .8rem; font-weight: 650; color: var(--muted); }
.preserved-label span { margin-left: .5rem; font-size: .72rem; font-weight: 400; }
.preserved-source figure { margin: 0; }
.preserved-image { display: block; width: fit-content; max-width: 100%; }
.preserved-image img { display: block; max-width: 100%; height: auto; background: #fff; }
.preserved-source figcaption { margin-top: .6rem; font-size: .75rem; color: var(--muted); }
footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .82rem; }
@media (max-width: 1199.98px) {
  main { padding: 1.4rem 0 3rem; }.header-inner { padding: .6rem 1rem; }.site-header nav { gap: .7rem; }
}
@media (max-width: 650px) {
  .pair > div { padding: .6rem 0; }.pair > .japanese { padding: .6rem 0 .8rem; }
  .site-header nav { font-size: .72rem; }.brand span { display: none; }
}

.pair.math .math-content { padding: .4em 0; }
.pdf-math-source { display: inline-block; max-width: 100%; vertical-align: middle; white-space: nowrap; margin: 0 .08em; padding: .12em 0; }
.pdf-math-source.wide-math { overflow-x: auto; overflow-y: hidden; }
.math-value { overflow-wrap: anywhere; white-space: normal; font-size: .95em; }
.pdf-math-source .katex { font-size: 1.1em; }
/* Algorithms (pseudocode) keep their printed lines and indentation; those written with inline LaTeX are a div so that KaTeX renders them. */
.algorithm { white-space: pre-wrap; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .86em; line-height: 1.6; overflow-x: auto; margin: 0; }
div.algorithm .katex { font-size: 1.05em; }
/* A long display formula in a narrow column: keep the equation number after the formula instead of over it (the display scrolls sideways). */
.math-content .katex-display > .katex > .katex-html > .katex-tag { position: static; display: inline-block; margin-left: 1em; }
/* A long inline formula cannot wrap: let its column scroll instead of widening the page. */
section.pair > div { min-width: 0; overflow-x: auto; }
/* 表は列の幅に収める。単語は途中で折らないので、列が多い表や長い語（URL など）で収まらないときだけ横にスクロールする。
   （以前は min-width: 34rem を指定していたため、2 段組の列より広くなり、すべての表に横スクロールが出ていた） */
section.pair td, section.pair th { overflow-wrap: normal; word-break: normal; }

/* 段落の左に表示する操作（リンクのコピー・原文 PDF） */
section.pair[id], section.preserved-source[id] { position: relative; }
.has-row-tools .source-ref { display: none; }
.row > .row-tools, .row-tools { position: absolute; top: .4rem; right: 100%; margin-right: .3rem; display: flex; flex-direction: column; gap: 2px; z-index: 5;
  width: auto; max-width: none; padding: 0; flex: none; }
.row-tools a { display: block; min-width: 2.6rem; padding: 0 .3rem; font-size: 11px; line-height: 1.7; text-align: center; white-space: nowrap;
  color: var(--muted); background: #fff; border: 1px solid var(--line); border-radius: 4px; text-decoration: none; }
.row-tools a:hover, .row-tools a:focus { color: var(--blue); background: #e9ecef; }
.row-tools a[hidden] { display: none; }
.pair:target, .preserved-source:target, .row-highlight { background-color: #fff8db; transition: background-color 2s ease-out; }
.row-toast { position: fixed; left: 50%; bottom: 1.5rem; transform: translateX(-50%); padding: .4rem .9rem; border-radius: 6px;
  background: rgba(33, 37, 41, .9); color: #fff; font-size: .85rem; opacity: 0; pointer-events: none; transition: opacity .2s; z-index: 20; }
.row-toast.show { opacity: 1; }
/* 左の余白が狭い画面では、段落の右上に横並びで表示する */
@media (max-width: 1259.98px) {
  .row > .row-tools, .row-tools { top: -.2rem; right: .5rem; margin-right: 0; flex-direction: row; }
}
/* 本文の幅をヘッダーにそろえ、左の余白に操作を表示できるようにする */
@media (min-width: 1260px) {
  .container#top { max-width: 1140px; }
}

/* 脚注は印刷物と同じく、小さめの文字で本文の下にまとめ、最初の脚注の上にだけ細い線を引く */
section.pair.footnote { padding: .55rem 0 .1rem; margin-top: .4rem; border-top: 1px solid var(--line); font-size: .86rem; color: var(--muted); }
section.pair.footnote + section.pair.footnote { padding-top: 0; margin-top: 0; border-top: 0; }
section.pair.footnote > div { padding-top: .2rem; padding-bottom: .2rem; }
section.pair.footnote sup { color: var(--ink); }
@media (max-width: 767.98px) {
  section.pair.footnote + section.pair.footnote { padding-top: .45rem; }
}

/* 資料の情報パネル（rfc-translater の alert-info と同じ青） */
.doc-panel { color: #055160; background: #cff4fc; border: 1px solid #b6effb; border-radius: .375rem; padding: 1rem 1.1rem; margin: .4rem 0 1rem; line-height: 1.75; overflow-wrap: anywhere; }
.doc-panel-heading { font-size: 1.45rem; font-weight: 500; margin: 0 0 .5rem; color: inherit; }
.doc-panel a { color: #04414d; font-weight: 600; }
.doc-summary { border: 1px solid rgba(0, 0, 0, .175); border-radius: .375rem; padding: .9rem 1.1rem; margin-bottom: 1rem; background: #fff; }
.doc-summary p { margin: 0; }
.doc-disclaimer { font-size: .85rem; color: var(--muted); }

/* ダークテーマ（ヘッダー右上のボタン、または OS の設定）。Bootstrap には data-bs-theme="dark" も渡す */
html.dark-theme { color-scheme: dark; --ink: #d5d9de; --muted: #9aa3ad; --line: #30353b; --blue: #6ea8fe; --pale: #1c1f23; }
html.dark-theme body { background: #121212; color: var(--ink); }
html.dark-theme .doc-panel { color: #c2cfdb; background: #151a1d; border-color: #2e3a40; }
html.dark-theme .doc-panel a { color: #6ec6ef; }
html.dark-theme .doc-summary { background: #1a1b1e; border-color: #30353b; }
html.dark-theme .pending { color: #8a939c; }
html.dark-theme .withheld-mark, html.dark-theme .table-image figcaption { color: #9aa3ad; }
html.dark-theme .draft-badge { color: #f0c674; background: #3a2f17; }
html.dark-theme .row-tools a { background: #1a1b1e; border-color: #30353b; }
html.dark-theme .row-tools a:hover, html.dark-theme .row-tools a:focus { background: #25282c; }
html.dark-theme .pair:target, html.dark-theme .preserved-source:target, html.dark-theme .row-highlight { background-color: #3a3418; }
html.dark-theme .row-toast { background: rgba(233, 236, 239, .95); color: #121212; }
/* 図・表の画像は原本の白地のまま見せる（黒い線や文字が背景に沈まないように） */
html.dark-theme .pair img, html.dark-theme .preserved-image img { background: #fff; }
html.dark-theme .pair :is(table, thead, tbody, tfoot, tr), html.dark-theme .source-only :is(table, thead, tbody, tfoot, tr) { color: inherit; }
html.dark-theme .pair th, html.dark-theme .pair td, html.dark-theme .source-only th, html.dark-theme .source-only td { color: inherit; background-color: transparent; }

/* 2 段組の列に収まらない表（列が多い表など）は、英文と訳文を全幅で上下に並べる（page.html の判定で .pair-wide を付ける） */
section.pair.pair-wide > .english, section.pair.pair-wide > .japanese { flex: 0 0 100%; max-width: 100%; width: 100%; }
section.pair.pair-wide > .japanese { padding-top: 0; }
/* スマートフォンでは表の文字と余白を少し詰め、わずかにはみ出す表を収める */
@media (max-width: 575.98px) {
  .source-only table, .pair table { font-size: .78rem; }
  .source-only th, .source-only td, .pair th, .pair td { padding: .35rem .4rem; }
}

/* 目次（rfc-translater と同じ: 上部の固定バーと、左から開く目次） */
.pair, .preserved-source { scroll-margin-top: 3.4rem; }
.toc-bar { position: fixed; top: .5rem; left: 50%; transform: translateX(-50%); z-index: 30; width: min(1108px, calc(100% - 1rem));
  display: flex; align-items: center; gap: .6rem; padding: .3rem .4rem; border: 1px solid var(--line); border-radius: 8px;
  background: rgba(255, 255, 255, .96); box-shadow: 0 2px 10px rgba(0, 0, 0, .08); font-size: .88rem; }
.toc-bar[hidden] { display: none; }
.toc-bar-open { flex: 0 0 auto; min-height: 34px; padding: 0 .8rem; border: 1px solid var(--line); border-radius: 6px; background: var(--pale);
  color: var(--ink); font: inherit; font-weight: 650; cursor: pointer; }
.toc-bar-open:hover { border-color: var(--blue); color: var(--blue); }
.toc-bar-current { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--ink); text-decoration: none; }
.toc-bar-current:hover { color: var(--blue); text-decoration: underline; }
.toc-dialog { position: fixed; inset: 0 auto 0 0; width: min(28rem, 92vw); max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0;
  border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--ink); display: none; flex-direction: column; }
.toc-dialog[open] { display: flex; }
.toc-dialog::backdrop { background: rgba(0, 0, 0, .35); }
.toc-head { display: flex; align-items: center; justify-content: space-between; padding: .7rem .9rem .4rem; }
.toc-close { width: 36px; height: 36px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.toc-close:hover { background: var(--pale); color: var(--ink); }
.toc-filter { margin: 0 .9rem .5rem; padding: .45rem .65rem; border: 1px solid var(--line); border-radius: 6px; background: transparent; color: var(--ink); font: inherit; font-size: .9rem; }
.toc-filter:focus { outline: 3px solid #9ec5fe; outline-offset: 0; border-color: var(--blue); }
.toc-show-all { display: flex; align-items: center; gap: .4rem; margin: 0 .9rem .5rem; color: var(--muted); font-size: .8rem; cursor: pointer; }
.toc-list { flex: 1 1 auto; overflow-y: auto; padding: 0 .4rem 1.5rem; border-top: 1px solid var(--line); }
.toc-item { display: block; padding: .3rem .5rem; border-radius: 5px; color: var(--ink); font-size: .88rem; line-height: 1.45; text-decoration: none; }
.toc-item:hover, .toc-item:focus { background: var(--pale); color: var(--blue); }
.toc-item[hidden] { display: none; }
.toc-depth-1 { font-weight: 650; margin-top: .3rem; }
.toc-depth-2 { padding-left: 1.4rem; }
.toc-depth-3 { padding-left: 2.4rem; font-size: .84rem; }
.toc-depth-4 { padding-left: 3.4rem; font-size: .82rem; color: var(--muted); }
.toc-dialog:not(.toc-all) .toc-depth-4 { display: none; }
.toc-item.toc-current { background: #e7f1ff; color: var(--blue); font-weight: 700; }
html.dark-theme .toc-bar { background: rgba(26, 27, 30, .96); box-shadow: 0 2px 10px rgba(0, 0, 0, .5); }
html.dark-theme .toc-dialog { background: #1a1b1e; }
html.dark-theme .toc-item.toc-current { background: #1d2a3d; }
@media (max-width: 575.98px) {
  .toc-bar { top: .35rem; font-size: .82rem; }
  .toc-dialog { width: 100vw; border-right: 0; }
}

/* 原本の目次（Table of Contents・図表一覧）: 節番号の深さで字下げし、ページ番号は出さず、見出しへのリンクにする */
section.pair.ptoc { margin: 0; }
section.pair.ptoc > div { padding-top: .12rem; padding-bottom: .12rem; }
section.pair.ptoc + section.pair:not(.ptoc) { margin-top: .8rem; }
.ptoc-link, .ptoc-text { display: block; text-decoration: none; color: var(--ink); line-height: 1.5; }
.ptoc-link:hover { color: var(--blue); text-decoration: underline; }
.ptoc-depth-1 .ptoc-link, .ptoc-depth-1 .ptoc-text { font-weight: 650; padding-top: .35rem; }
.ptoc-depth-2 > div { padding-left: 2.2rem; }
.ptoc-depth-3 > div { padding-left: 3.4rem; font-size: .94rem; }
.ptoc-depth-4 > div { padding-left: 4.6rem; font-size: .9rem; }
@media (max-width: 767.98px) {
  .ptoc-depth-2 > div { padding-left: 1.2rem; }
  .ptoc-depth-3 > div { padding-left: 2rem; }
  .ptoc-depth-4 > div { padding-left: 2.8rem; }
}
/* 段落として抽出された目次・図表一覧の題（"Contents"、"List of Figures"）は見出しと同じ大きさにする */
section.pair.ptoc-title { margin-top: 1.2rem; }
section.pair.ptoc-title > div { font-size: 1.3rem; font-weight: 500; line-height: 1.3; }
/* 抽出で 1 つの段落にまとまった目次の行: 行ごとに字下げする */
.ptoc-depth-multi .ptoc-line { padding-top: .12rem; padding-bottom: .12rem; }
.ptoc-line-depth-1 { font-weight: 650; padding-top: .35rem !important; }
.ptoc-line-depth-2 { padding-left: 1.4rem; }
.ptoc-line-depth-3 { padding-left: 2.6rem; font-size: .94rem; }
.ptoc-line-depth-4 { padding-left: 3.8rem; font-size: .9rem; }
@media (max-width: 767.98px) {
  .ptoc-line-depth-2 { padding-left: 1.2rem; } .ptoc-line-depth-3 { padding-left: 2rem; } .ptoc-line-depth-4 { padding-left: 2.8rem; }
}