/*
 * 入力ガイド（/guide/）だけで読む追加の CSS。土台は /assets/css/site.css（部品は /_design/）。
 * ページは tools/site/guide.py が作る（手で直さない）。この CSS を変えたら guide.py の GUIDE_CSS_VERSION を上げて作り直す
 * （/assets/* は 1 年キャッシュする）。色は site.css の変数だけを使う。
 */

/* 目次: 1・2・3 の番号の代わりに、ICAO の項の番号（7・8・…・19）を出す */
.g-toc a::before { content: none; }
.g-toc a { grid-template-columns: 2.2em 1fr; }
.g-toc-no { font-family: var(--font-data); font-weight: 700; color: var(--mag); font-variant-numeric: tabular-nums; }
.g-toc .toc-src a, .g-toc .g-toc-ex a { color: var(--ink-2); }
.g-toc a > span:last-child { word-break: keep-all; overflow-wrap: anywhere; } /* 項の名前は・の後（<wbr>）でだけ折り返す（「代替」などを途中で切らない） */

/* このガイドについて: 写真（アプリの i の説明）は幅 420px まで（2 列にならない幅で大きくなりすぎないように） */
.g-about { padding-left: 1.3em; font-size: 15.5px; line-height: 1.85; color: var(--ink-2); }
.g-about li + li { margin-top: .45em; }
.g-about b { font-family: var(--font-data); color: var(--ink); }
.g-intro-fig { max-width: 420px; }

/* 例の計画（電文）の下の注記 */
.telex + .g-telex-note { margin-top: 12px; max-width: 64em; }

/* 節の頭: 見出しは項の名前（主張の文にしない）。上の小見出しに「第 N 項」 */
.g-sec .sec-head { margin-bottom: 24px; }
.g-sub { margin: 36px 0 12px; }

/* この項の例: IFR と VFR を同じ形・同じ重さで縦に並べる。IFR は実線、VFR は破線（航空図・運航票・電文と同じ。色だけで分けない） */
.g-ex { margin: 0 0 28px; max-width: 760px; }
.g-ex figcaption { margin-bottom: 6px; font-size: 13px; font-weight: 700; letter-spacing: .04em; color: var(--ink-3); }
.g-ex-rows { border-top: 1px solid var(--rule-2); }
.g-ex-rows > div { display: grid; grid-template-columns: 3.2em minmax(0, 1fr); gap: 2px 12px; align-items: baseline; padding: 9px 0 10px 12px; border-left: 3px solid var(--mag); border-bottom: 1px solid var(--rule); background: var(--sheet-2); }
.g-ex-rows > .is-vfr { border-left-style: dashed; }
.g-ex-rows dt { font-family: var(--font-data); font-size: 12.5px; font-weight: 700; letter-spacing: .06em; color: var(--ink-2); }
.g-ex-v { font-family: var(--font-mono); font-size: 15px; line-height: 1.6; letter-spacing: .01em; color: var(--ink); overflow-wrap: anywhere; }
.g-ex-g { display: block; font-size: 13px; line-height: 1.6; color: var(--ink-3); }
.g-ex-note { margin-top: 8px; font-size: 13.5px; line-height: 1.75; color: var(--ink-3); }
.g-ex-note .data { color: var(--ink-2); }
.g-ex-note .tag { margin-left: .3em; }

/* 欄（.terms の行）: 名前・電文で書く項・説明の行（アプリの i のシートと同じく 1 行に 1 つの事柄）・出典 */
.g-fields > div { scroll-margin-top: calc(var(--head-h) + 16px); }
.g-fields > div:target { background: var(--mag-tint); box-shadow: -12px 0 0 var(--mag-tint), 12px 0 0 var(--mag-tint); }
.g-fields dt { font-size: 17px; line-height: 1.6; word-break: keep-all; overflow-wrap: anywhere; } /* 名前は空白と・の後（<wbr>）でだけ折り返す */
.g-fields dt .data { margin-right: 0; font-weight: 700; }
.g-item { display: block; margin-top: 2px; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; color: var(--mag); }
.g-lines { list-style: none; }
.g-lines li { padding: 7px 0; border-bottom: 1px solid var(--rule); font-size: 15.5px; line-height: 1.8; color: var(--ink); }
.g-lines li:first-child { padding-top: 0; }
.g-lines li:last-child { border-bottom: 0; }
.g-lines .tag { margin-left: .4em; }
.g-lines code { font-family: var(--font-mono); font-size: .92em; }
.g-src { margin-top: 8px; font-size: 13px; line-height: 1.7; color: var(--ink-3); }
@media (min-width: 900px) { .g-fields > div { grid-template-columns: 12em minmax(0, 1fr); } }

/* 選択肢の表（飛行目的 MSN= の略号） */
.g-opts-wrap { margin-top: 12px; max-width: 30em; }
.g-opts { font-size: 14.5px; }
.g-opts caption { font-size: 13.5px; color: var(--ink-2); }
.g-opts th, .g-opts td { padding: 6px 12px; }
.g-opts tbody th { width: 4.5em; font-weight: 400; color: var(--ink); white-space: nowrap; }

/* 出典の資料名 */
.sources li b { color: var(--ink); word-break: keep-all; overflow-wrap: anywhere; } /* 資料名は・と <wbr> の所でだけ折り返す */
.sources ol + p { margin-top: .9em; }