/* bobbywedding.com 全站樣式（深色、以照片為主） */
:root {
	--bg: #111;
	--fg: #ddd;
	--muted: #888;
	--gold: #b08a3e;
	--line: #2a2a2a;
	--rh: 55vw; /* 相簿每列基準高度（手機） */
	color-scheme: dark;
}
@media (min-width: 700px) {
	:root { --rh: 300px; }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--bg);
	color: var(--fg);
	font: 16px/1.7 -apple-system, BlinkMacSystemFont, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 頁首：logo + 三個分類按鈕 */
.top { text-align: center; padding: 20px 16px 8px; }
.logo { display: inline-block; }
.logo img { width: 220px; }
.cats { display: flex; justify-content: center; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.cats a {
	padding: 6px 16px;
	border: 1px solid var(--line);
	border-radius: 999px;
	font-size: 15px;
	letter-spacing: .08em;
	color: var(--muted);
	transition: color .2s, border-color .2s;
}
.cats a:hover { color: var(--fg); border-color: var(--muted); }
.cats a[aria-current] { color: var(--gold); border-color: var(--gold); }

main { max-width: 1240px; margin: 0 auto; padding: 16px; }

/* 分類列表：封面卡片 */
.grid { display: grid; gap: 28px 20px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); }
.card { display: block; }
.card img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: #1c1c1c; transition: opacity .2s; }
.card:hover img { opacity: .85; }
.card-title { display: block; margin-top: 10px; font-size: 16px; letter-spacing: .03em; }
.card time { font-size: 13px; color: var(--muted); }

/* 文章 */
.post-head { text-align: center; margin: 8px 0 24px; }
.post-head h1 { margin: 0; font-size: 24px; font-weight: 500; letter-spacing: .05em; }
.meta { margin: 4px 0 0; font-size: 14px; color: var(--muted); }
.meta a { color: var(--gold); }
.post-body { max-width: 720px; margin: 0 auto 28px; color: #bbb; }
.post-body p { margin: 0 0 .6em; }

/* 相簿：等高排列（每張的寬度依長寬比分配，保持原本順序） */
.gallery { display: flex; flex-wrap: wrap; gap: 6px; }
.gallery::after { content: ""; flex-grow: 1e4; }
.gallery a { flex: var(--r) 1 calc(var(--r) * var(--rh)); background: #1c1c1c; cursor: zoom-in; }
.gallery img { width: 100%; }

.pager { display: flex; justify-content: space-between; gap: 16px; margin: 40px 0 8px; font-size: 14px; color: var(--muted); }
.pager a:hover { color: var(--gold); }
.pager .next { text-align: right; }

.notfound { text-align: center; padding: 80px 0; }
.notfound a { color: var(--gold); }

.foot { text-align: center; padding: 40px 16px; font-size: 12px; color: #555; letter-spacing: .1em; }

/* 燈箱（site.js） */
.lb { position: fixed; inset: 0; z-index: 10; background: rgba(0, 0, 0, .95); display: flex; align-items: center; justify-content: center; touch-action: pan-y; }
.lb[hidden] { display: none; }
.lb img { max-width: 100vw; max-height: 100vh; max-height: 100dvh; width: auto; height: auto; object-fit: contain; user-select: none; }
.lb button { position: absolute; background: none; border: 0; color: #aaa; font-size: 32px; padding: 16px 20px; cursor: pointer; }
.lb button:hover { color: #fff; }
.lb .lb-close { top: 0; right: 0; }
.lb .lb-prev { left: 0; top: 50%; transform: translateY(-50%); }
.lb .lb-next { right: 0; top: 50%; transform: translateY(-50%); }
.lb .lb-count { position: absolute; bottom: 12px; left: 0; right: 0; text-align: center; font-size: 13px; color: #777; }
