/* FuFuLin — 只在這裡改配色 */
:root{--bg:#FAF8F5;--text:#1F1F1F;--muted:#5F5F5F;--accent:#C23B22;--accent-soft:#FBE9E4;--line:#E5E1DA;--field:#FFFFFF}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Noto Sans TC','Noto Sans CJK TC','PingFang TC','Microsoft JhengHei',system-ui,sans-serif;font-weight:400;font-size:19px;line-height:1.85;text-align:left;overflow-wrap:break-word}
a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:2px}
/* 字重：大標 700 → 段落標題 500 → 內文 400 */
h1,h2,h3,h4,.site-title{font-family:inherit;font-weight:500;line-height:1.4;letter-spacing:.01em}
h1,.post-title,.page-title,.site-title{font-weight:700}
p{margin:0 0 1.15em}
img,video,svg{max-width:100%;height:auto}
table{display:block;width:max-content;max-width:100%;overflow-x:auto;border-collapse:collapse;font-size:.9em}
th,td{border-bottom:1px solid var(--line);padding:.4em .7em;text-align:left;vertical-align:top;min-width:4.5em;max-width:22em;overflow-wrap:anywhere}
pre{max-width:100%;overflow-x:auto}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:1rem;top:-5rem;background:var(--accent-soft);padding:.3rem .8rem;z-index:20}
.skip-link:focus{top:1rem}

/* ---------- 版面：左欄導覽，右欄閱讀 ---------- */
.site{display:grid;grid-template-columns:260px minmax(0,680px);column-gap:clamp(64px,7vw,96px);justify-content:center;align-items:start;padding:0 clamp(32px,4vw,64px)}
.sidebar{position:sticky;top:0;align-self:start;max-height:100vh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.sidebar-inner{padding:44px 4px 32px 0}
.content{min-width:0;padding:52px 0 48px}

/* 左欄：照片、名稱、簡介 */
.author-photo{display:block;width:160px;height:160px;object-fit:cover;border-radius:50%;background:var(--line);margin:0 0 18px}
.site-title{display:inline-block;color:var(--text);font-size:1.9rem;line-height:1.15;letter-spacing:-.01em;text-decoration:none}
.site-title:hover{color:var(--accent);text-decoration:none}
.byline{margin:.35rem 0 0;font-size:.88rem;color:var(--muted)}
.site-tagline{margin:.6rem 0 0;font-size:.92rem;line-height:1.65;color:var(--text)}
.menu-toggle{display:none}

/* 左欄各區塊 */
.sidebar-panel{margin-top:4px}
.side-block{border-top:1px solid var(--line);margin-top:18px;padding-top:15px;font-size:.88rem;line-height:1.65;color:var(--muted)}
.side-block p{margin:0 0 .5em}
.side-label{display:block;margin:0 0 .55rem;font-size:.8rem;font-weight:500;letter-spacing:.08em;color:var(--text)}
.side-nav{list-style:none;margin:0;padding:0}
.side-nav li+li{margin-top:.2rem}
.side-social{margin:.8rem 0 0!important;font-size:.85rem}
.side-social a{color:var(--muted)}
.side-nav a{color:var(--text);text-decoration:none;font-size:.95rem}
.side-nav a:hover{color:var(--accent);text-decoration:underline}
.side-nav a[aria-current="page"]{color:var(--accent);font-weight:500}
.search-row{display:flex;gap:6px}
.search-row input{flex:1;min-width:0;font:inherit;font-size:.9rem;padding:.42rem .6rem;border:1px solid #CFC9BF;border-radius:2px;background:var(--field);color:var(--text)}
.search-row button{font:inherit;font-size:.85rem;padding:.42rem .8rem;border:1px solid var(--text);border-radius:2px;background:var(--text);color:#fff;cursor:pointer}
.search-row button:hover{background:var(--accent);border-color:var(--accent)}

/* ---------- 文章 ---------- */
.post+.post{border-top:1px solid var(--line);margin-top:72px;padding-top:64px}
.post-title{font-size:2rem;line-height:1.38;margin:0 0 1.1rem}
.post-title a{color:var(--text);text-decoration:none}
.post-title a:hover{color:var(--accent)}
.page-title{font-size:2rem;line-height:1.38;margin:0 0 1.4rem}
.post .lead{font-size:1.08em;line-height:1.8}
.post .sec{font-size:1.35rem;margin:2.4rem 0 .9rem}
.post .sub{font-size:1.1rem;color:var(--accent);margin:2rem 0 .6rem}
blockquote{border-left:3px solid var(--accent);margin:1.8rem 0;padding:.1rem 0 .1rem 1.2rem;font-weight:500}
blockquote p:last-child{margin-bottom:0}
mark{background:var(--accent-soft);color:inherit;padding:0 .1em}
sup.fn{font-size:.68em;line-height:0;margin-left:.08em}
sup.fn a{text-decoration:none;padding:0 .12em}
.closing{border-top:2px solid var(--text);margin:2.6rem 0 0;padding-top:1.3rem}
.closing p{font-weight:500;font-size:1.05em;line-height:1.75;margin-bottom:.8em}
.read-more{margin:.4rem 0 0;font-size:.95rem}
.read-more a{font-weight:500}
.post-meta{margin:1.6rem 0 0;font-size:.82rem;color:var(--muted)}
.post-meta a{color:var(--muted)}
.footnotes{border-top:1px solid var(--line);margin-top:2.2rem;padding-top:1.1rem;color:var(--muted);font-size:.82rem;line-height:1.7}
.footnotes .notes-title{font-size:.9rem;color:var(--text);margin:0 0 .5rem}
.footnotes ol{margin:0;padding-left:1.4rem}
.footnotes li{overflow-wrap:anywhere}
.footnotes li+li{margin-top:.3rem}
.fn-back{text-decoration:none}
[id^="note-"],[id^="ref-"],.archive-section{scroll-margin-top:24px}
.post-nav{display:flex;justify-content:space-between;gap:1.5rem;border-top:1px solid var(--line);margin-top:3rem;padding-top:1.1rem;font-size:.88rem}
.post-nav a{text-decoration:none}
.unavailable{color:var(--muted)}
.older-posts{border-top:1px solid var(--line);margin-top:72px;padding-top:1.2rem;font-size:.95rem}

/* YouTube 影片：寬度跟正文，16:9 */
.video{margin:1.8rem 0}
.video-frame{position:relative;width:100%;aspect-ratio:16/9;background:#111;border-radius:2px;overflow:hidden}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video figcaption{margin-top:.5rem;font-size:.85rem;line-height:1.6;color:var(--muted)}
.video-link{display:block}

/* 全部文章 */
.archive-section h2,.category-heading{font-size:1.25rem;margin:1.8rem 0 .6rem}
.archive-section h3{font-size:1.05rem;margin:1.2rem 0 .3rem}
.archive-section ul{margin:.2rem 0 0;padding-left:1.3rem}
.archive-list{list-style:none;padding-left:0!important}
.archive-list li{display:flex;gap:1rem;align-items:baseline;padding:.25rem 0}
.archive-list time{flex:0 0 6.5rem;color:var(--muted);font-size:.85rem}
.category-heading{border-top:1px solid var(--line);padding-top:1.6rem;margin-top:2.6rem}
.about-page h2{font-size:1.25rem;margin:2rem 0 .5rem}

/* 搜尋頁 */
.search-main label{display:block;font-size:.85rem;color:var(--muted);margin-bottom:.3rem}
.search-main .search-row input{font-size:1rem;padding:.55rem .7rem}
.search-main .search-row button{font-size:.92rem;padding:.55rem 1rem}
.search-main .search-row{flex-wrap:wrap}
.search-main .search-row input{flex:1 1 12rem}
.search-main .search-clear{background:transparent!important;color:var(--text)!important;border-color:#CFC9BF!important}
.search-status{margin:1.2rem 0 .4rem;font-size:.9rem;color:var(--muted)}
.search-results{list-style:none;margin:0;padding:0}
.search-results li{border-top:1px solid var(--line);padding:1.2rem 0}
.search-results h2{font-size:1.2rem;margin:0 0 .25rem}
.search-results h2 a{color:var(--text);text-decoration:none}
.search-results h2 a:hover{color:var(--accent);text-decoration:underline}
.search-results .result-meta{font-size:.8rem;color:var(--muted);margin:0 0 .35rem}
.search-results .result-snippet{font-size:.92rem;line-height:1.7;margin:0}

.site-footer{border-top:1px solid var(--line);margin-top:72px;padding-top:1rem;color:var(--muted);font-size:.78rem}
.site-footer p{margin:0}

/* 矮視窗：縮小照片與間距，左欄仍可內部捲動 */
@media (min-width:960px) and (max-height:820px){
.sidebar-inner{padding-top:28px}
.author-photo{width:120px;height:120px;margin-bottom:12px}
.side-block{margin-top:14px;padding-top:12px}
}

/* 更矮的視窗（例如 1024×600 筆電）：再縮一級，讓左欄整欄放得下，不必捲動 */
@media (min-width:960px) and (max-height:700px){
.sidebar-inner{padding:18px 4px 16px 0}
.author-photo{width:84px;height:84px;margin-bottom:8px}
.site-title{font-size:1.65rem}
.site-tagline{margin-top:.35rem}
.side-block{margin-top:10px;padding-top:9px}
.side-label{margin-bottom:.35rem}
.side-social{margin-top:.5rem!important}
}

/* ---------- 手機與平板：單欄，左欄收進選單 ---------- */
@media (max-width:959px){
body{font-size:17.5px;line-height:1.85}
.site{display:block;padding:0 22px}
.sidebar{position:static;max-height:none;overflow:visible;border-bottom:1px solid var(--line);margin:0 -22px;padding:0 22px}
.sidebar-inner{padding:14px 0}
.brand{display:flex;align-items:center;gap:14px}
.author-photo{width:64px;height:64px;margin:0;flex:0 0 auto}
.brand-text{flex:1;min-width:0}
.site-title{font-size:1.35rem}
.byline{margin:.1rem 0 0;font-size:.875rem}
.site-tagline{display:none}
.menu-toggle{display:inline-flex;align-items:center;gap:.45rem;flex:0 0 auto;min-height:44px;font:inherit;font-size:.9rem;color:var(--text);background:transparent;border:1px solid #CFC9BF;border-radius:2px;padding:0 .85rem;cursor:pointer}
.menu-icon,.menu-icon::before,.menu-icon::after{display:block;width:14px;height:2px;background:currentColor;position:relative}
.menu-icon::before,.menu-icon::after{content:"";position:absolute;left:0}
.menu-icon::before{top:-5px}.menu-icon::after{top:5px}
.menu-toggle[aria-expanded="true"] .menu-icon{background:transparent}
.menu-toggle[aria-expanded="true"] .menu-icon::before{top:0;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] .menu-icon::after{top:0;transform:rotate(-45deg)}
.js .sidebar-panel{display:none}
.js .sidebar.is-open .sidebar-panel{display:block}
.side-block:first-child{margin-top:16px}
.content{max-width:680px;margin:0 auto;padding:30px 0 40px}
.post-title,.page-title{font-size:1.6rem}
.post .sec{font-size:1.25rem}
.post+.post{margin-top:56px;padding-top:48px}
.archive-list li{display:block}
.archive-list time{display:block}
.post-nav{flex-direction:column;gap:.6rem}
/* 觸控：輸入框 16px（避免 iOS 自動放大），按鈕與連結至少 44px 高 */
.search-row input{font-size:16px;min-height:44px;padding:.5rem .7rem}
.search-row button{min-height:44px;font-size:.95rem;padding:0 1rem}
.side-nav li+li{margin-top:0}
.side-nav a{display:flex;align-items:center;min-height:44px;font-size:1rem}
.side-social{display:flex;flex-wrap:wrap;align-items:center;column-gap:.6rem;margin-top:.4rem!important}
.side-social a{display:inline-flex;align-items:center;min-height:44px;font-size:.95rem}
/* 小字放大：搜尋摘要、註腳、作者姓名 */
.search-results .result-meta{font-size:.85rem}
.search-results .result-snippet{font-size:.95rem;line-height:1.75}
.footnotes{font-size:.875rem;line-height:1.75}
.footnotes li+li{margin-top:.5rem}
.post-meta{font-size:.875rem}
}
