/* 「日の出・日の入りと横風」の欄（apfacts.js が描く。2026-11-02 案 S1・X2） */
:root { --apf-night: #23295e; --apf-tw: #8a7fd0; --apf-day: #ffe08a; --apf-tail: #b04a00; --apf-cross: #1a62c2; --apf-at: #d32f2f; --apf-rwy: #5b6675; --apf-dial: #f3f7fc; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --apf-day: #e9c75a; --apf-tail: #ffab66; --apf-cross: #8cbcff; --apf-at: #ff6b6b; --apf-rwy: #7d8a9c; --apf-dial: #1d2a3e; } }
:root[data-theme="dark"] { --apf-day: #e9c75a; --apf-tail: #ffab66; --apf-cross: #8cbcff; --apf-at: #ff6b6b; --apf-rwy: #7d8a9c; --apf-dial: #1d2a3e; }

/* S1 */
.apf-sun { margin: 6px 0 4px; }
.apf-times { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; text-align: center; margin: 4px 0 26px; }
.apf-times span { display: block; font-size: .8rem; color: var(--muted); }
.apf-times b { display: block; font-size: 1.15rem; }
.apf-bar { position: relative; height: 20px; border-radius: 6px; background: var(--apf-night); }
.apf-bar > span:not(.apf-mark) { position: absolute; top: 0; bottom: 0; }
.apf-tw { background: var(--apf-tw); }
.apf-day { background: var(--apf-day); }
.apf-mark { position: absolute; top: -6px; bottom: -6px; width: 3px; margin-left: -1.5px; border-radius: 2px; background: var(--apf-at); }
.apf-mark i { position: absolute; bottom: calc(100% + 2px); left: 50%; transform: translateX(-50%); font-style: normal; font-size: .75rem; font-weight: 800; color: var(--apf-at); white-space: nowrap; }
.apf-ticks { position: relative; height: 16px; font-size: .72rem; color: var(--muted); margin-top: 3px; }
.apf-ticks span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
.apf-ticks span:first-child { transform: none; }
.apf-ticks span:last-child { transform: translateX(-100%); }
.apf-key { font-size: .75rem; color: var(--muted); margin: 4px 0 0; display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.apf-k { display: inline-block; width: 12px; height: 10px; border-radius: 2px; margin-left: 6px; }
.apf-k:first-child { margin-left: 0; }
.apf-k-n { background: var(--apf-night); } .apf-k-t { background: var(--apf-tw); } .apf-k-d { background: var(--apf-day); }

/* X2 */
.apf-focus { font-weight: 700; margin: 6px 0; }
.apf-tok { font-family: ui-monospace, Menlo, Consolas, monospace; font-weight: 700; }
.apf-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 10px; margin: 6px 0; }
.apf-card { border: 1px solid var(--line); border-radius: 10px; padding: 8px; display: flex; gap: 10px; align-items: center; background: var(--card); }
.apf-fig { flex: none; width: 156px; height: 156px; }
.apf-dial { fill: var(--apf-dial); stroke: var(--line); stroke-width: 1.5; }
.apf-nesw { font-size: 9px; fill: var(--muted); font-weight: 700; }
.apf-rwy { stroke: var(--apf-rwy); stroke-linecap: butt; }
.apf-num text { font-size: 12px; font-weight: 800; fill: #fff; font-family: ui-monospace, Menlo, Consolas, monospace; }
.apf-opp text { fill: #c3ccd7; font-weight: 600; }
.apf-go { fill: var(--accent); }
.apf-wind { stroke: var(--apf-cross); stroke-width: 3.5; stroke-linecap: round; }
.apf-wind-h { fill: var(--apf-cross); }
line.apf-wind2 { stroke-dasharray: 5 4; stroke-width: 2.5; }
g.apf-wind2 { opacity: .85; }
.apf-halo { stroke: var(--apf-dial); stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; fill: var(--apf-dial); }
.apf-txt { min-width: 0; }
.apf-rw { margin: 0 0 4px; font-weight: 800; font-size: 1.02rem; }
.apf-rw small { display: block; font-weight: 600; font-size: .78rem; color: var(--muted); }
.apf-line { margin: 2px 0 4px; line-height: 1.45; }
.apf-line > span { display: inline-block; margin-right: 10px; font-weight: 800; }
.apf-rl { display: block; font-size: .75rem; color: var(--muted); font-weight: 700; }
.apf-tl { color: var(--apf-tail); }
.apf-cr { color: var(--apf-cross); }
.apf-line > .apf-gs { display: block; font-size: .8rem; font-weight: 600; color: var(--muted); }
.apf-st { font-size: .9rem; color: var(--muted); }
.apf-sub { margin: 4px 0 0; font-size: .78rem; color: var(--muted); line-height: 1.45; }
.apf-sub .apf-hd, .apf-sub .apf-tl, .apf-sub .apf-cr, .apf-list .apf-hd, .apf-list .apf-tl, .apf-list .apf-cr { font-weight: 700; }
.apf-list { list-style: none; padding: 0; margin: 10px 0 0; }
.apf-list li { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 7px 4px; border-bottom: 1px solid var(--line); font-size: .88rem; }
.apf-list li.apf-at { background: color-mix(in srgb, var(--apf-at) 9%, transparent); }
.apf-when { flex: 0 0 210px; font-weight: 700; line-height: 1.4; }
.apf-when em { font-style: normal; margin-left: 6px; padding: 0 6px; border-radius: 999px; background: var(--apf-at); color: #fff; font-size: .72rem; }
.apf-when code { display: block; font-weight: 600; color: var(--muted); font-size: .8rem; }
.apf-vals { flex: 1 1 260px; display: flex; flex-direction: column; gap: 2px; }
.apf-vals b { display: inline-block; min-width: 6.4em; }
@media (max-width: 560px) {
  .apf-cards { grid-template-columns: 1fr; }
  .apf-fig { width: 132px; height: 132px; }
  .apf-when { flex-basis: 100%; }
}

/* 欄の下の注意書き（計算の方法）は小さく（2026-11-02 クロノコ指示） */
[id^="sec-apfacts"] .note { font-size: .78rem; line-height: 1.6; }
[id^="sec-apfacts"] .links { font-size: .8rem; }
