/* Fisherman's Memoir — 読書補助 (Task 4) * 進捗バー / 文字サイズ切替 / 明・夜の海モード。単一記事のみ。 * 状態は の data 属性 + localStorage（fm-theme / fm-fontsize）。 */ /* ============ スクロール進捗バー ============ */ .fm-progress{ position:fixed; top:0; left:0; height:3px; width:0; background:var(--fm-rust); z-index:99999; transition:width .12s linear; pointer-events:none; } /* ============ 読書コントロール ============ */ .fm-controls{ max-width:720px; margin:0 auto; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; gap:14px 20px; flex-wrap:wrap; font-family:var(--fm-sans-jp); font-size:12px; letter-spacing:.04em; color:var(--fm-fog); border-bottom:1px solid var(--fm-paper-3); } .fm-controls .grp{ display:flex; align-items:center; gap:6px; } .fm-controls button{ font:inherit; color:inherit; background:none; border:1px solid var(--fm-paper-3); padding:5px 11px; line-height:1; cursor:pointer; } .fm-controls button:hover{ border-color:var(--fm-rope-dim); } .fm-controls button[aria-pressed="true"]{ border-color:var(--fm-rust); color:var(--fm-rust); } /* ============ 文字サイズ ============ */ html[data-fm-fontsize="s"] .post_content{ font-size:16px !important; } html[data-fm-fontsize="m"] .post_content{ font-size:19px !important; } html[data-fm-fontsize="l"] .post_content{ font-size:22px !important; } @media (max-width:767px){ html[data-fm-fontsize="s"] .post_content{ font-size:15.5px !important; } html[data-fm-fontsize="m"] .post_content{ font-size:17.5px !important; } html[data-fm-fontsize="l"] .post_content{ font-size:20px !important; } } /* ============ 夜の海モード ============ */ html[data-fm-theme="night"] body{ background:var(--fm-night) !important; } html[data-fm-theme="night"] #main_contents{ background:var(--fm-night); } html[data-fm-theme="night"] #page_header, html[data-fm-theme="night"] #bread_crumb{ background:var(--fm-night) !important; } html[data-fm-theme="night"] .post_content, html[data-fm-theme="night"] .post_content .tcdce-body, html[data-fm-theme="night"] .post_content p, html[data-fm-theme="night"] .post_content li{ color:#E4DBCB !important; } html[data-fm-theme="night"] .post_content a{ color:var(--fm-rope) !important; } html[data-fm-theme="night"] .post_content blockquote{ color:var(--fm-rope) !important; border-left-color:var(--fm-rust) !important; } html[data-fm-theme="night"] .fm-controls{ border-bottom-color:#22303f; color:#8996A2; } html[data-fm-theme="night"] .fm-controls button{ border-color:#22303f; } html[data-fm-theme="night"] .fm-controls button[aria-pressed="true"]{ border-color:var(--fm-rust); color:var(--fm-rope); } html[data-fm-theme="night"] #next_prev_post{ border-top-color:#22303f !important; } html[data-fm-theme="night"] #next_prev_post a{ color:#E4DBCB !important; } html[data-fm-theme="night"] #single_tab_post_list .item .title, html[data-fm-theme="night"] #single_tab_post_list .item .title span, html[data-fm-theme="night"] #related_post .item .title, html[data-fm-theme="night"] #related_post .item .title span{ color:#E4DBCB !important; } html[data-fm-theme="night"] #comments, html[data-fm-theme="night"] #comments .comment_headline, html[data-fm-theme="night"] #comments h2, html[data-fm-theme="night"] #comments h3, html[data-fm-theme="night"] #comments p, html[data-fm-theme="night"] #comments li{ color:#E4DBCB !important; }