/* ===== 共用基底：兩種風格的配色變數、線稿畫線動畫、登入畫面、風格切換鈕 =====
 * 風格 A「晨光簡約」：奶油米底（邀請函 A 版背景再暗一階）、咖啡色細線、玫瑰粉／鼠尾草綠／焦糖金點綴（body.theme-a）；白天 06:00–18:00 使用
 * 風格 B「星夜」：深藍底、金色線條與月亮（body.theme-b）；晚上 18:00–06:00 使用
 * 各頁只用變數取色，不直接寫色碼，這樣兩種風格才能共用同一份版面
 */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  min-height: 100vh; min-height: 100svh;
  background: var(--bg); color: var(--ink);
  font-family: 'Noto Sans TC', system-ui, -apple-system, sans-serif; font-weight: 300; line-height: 1.8;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  font-variant-numeric: lining-nums;   /* Cormorant 預設是舊式數字（0 看起來像 O），一律改成齊高數字 */
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; color: inherit; cursor: pointer; }

body.theme-a {            /* 晨光：邀請函 A 版的奶油米再暗一階＋玫瑰粉、鼠尾草綠、焦糖金（2026-10-03），背景圖見 dawn.css */
  --bg: #e9d6c6; --bg2: #dcc5b3; --ink: #3d2b1f; --muted: #695041; --accent: #a8626d;
  --rose: #a8626d; --sage: #6b8660; --gold: #9c7345;
  --line: #3d2b1f; --soft: rgba(61,43,31,.22); --card: #f6ece3; --on-accent: #fffaf5; --tone: #8ea6c9; --deep: #d6bda9;
  --serif: 'Cormorant Garamond', 'Noto Serif TC', serif;
  --num: 'Josefin Sans', 'Noto Sans TC', sans-serif;   /* 數字用幾何無襯線：Cormorant 的 0 像 O、1 像 I */
}
body.theme-b {
  --bg: #0b1630; --bg2: #101f42; --ink: #f1e8d2; --muted: #97a3c2; --accent: #e2bd68;
  --line: #e2bd68; --soft: rgba(226,189,104,.22); --card: #12224a; --on-accent: #0b1630; --tone: #4468b8; --deep: #162a5c;
  --serif: 'Cormorant Garamond', 'Noto Serif TC', serif;
  --num: 'Josefin Sans', 'Noto Sans TC', sans-serif;
}

/* ── 插圖（lib/art.php）：水彩 SVG 圖檔 assets/art/{a|b}-{名稱}.svg，用 <img> 載入；進入畫面時像水彩乾掉一樣由模糊淡入 ── */
.art { width: 100%; height: auto; display: block; object-fit: contain; }
.js .art-wc { opacity: 0; filter: blur(7px); transform: scale(.97); }
.js .is-in .art-wc, .js .art-wc.is-in { animation: bloom 1.7s cubic-bezier(.22,.7,.2,1) forwards; }
@keyframes bloom { to { opacity: 1; filter: blur(0); transform: none; } }
@media (prefers-reduced-motion: reduce) { .js .art-wc { opacity: 1; filter: none; transform: none; animation: none !important; } }

/* ── 登入畫面（settings.require_login = 1 時蓋住整個頁面）── */
.merry-auth { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--bg); }
.merry-auth[hidden] { display: none; }
.merry-auth-box { width: 100%; max-width: 340px; text-align: center; display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.merry-auth-text { white-space: pre-line; color: var(--muted); letter-spacing: .08em; margin-bottom: 8px; }
.merry-spin { width: 34px; height: 34px; margin: 0 auto 6px; border: 2px solid var(--soft); border-top-color: var(--accent); border-radius: 50%; animation: merry-spin 1s linear infinite; }
@keyframes merry-spin { to { transform: rotate(360deg); } }
.merry-btn { border: 1px solid var(--accent); background: transparent; color: var(--accent); padding: .8rem 1.2rem; border-radius: 3px; letter-spacing: .2em; font-size: .95rem; min-height: 46px; }
.merry-btn-line { background: #06c755; border-color: #06c755; color: #fff; font-weight: 500; letter-spacing: .12em; }
.merry-btn-ghost { border-color: transparent; color: var(--muted); font-size: .85rem; }
[hidden] { display: none !important; }

/* 經文：子句不拆開、出處獨立一行（lib/site.php verse_html） */
.vs { display: inline-block; }
.v-ref { display: block; margin-top: .4em; font-size: .92em; opacity: .85; letter-spacing: .12em; }
[class*="verse"] { text-wrap: balance; }

/* 頁尾署名 */
.site-credit { text-align: center; padding: 30px 16px calc(40px + env(safe-area-inset-bottom)); font: 300 .72rem/1.6 'Josefin Sans', 'Noto Sans TC', sans-serif; letter-spacing: .18em; color: var(--muted); opacity: .85; }
.site-credit.is-abs { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 16px calc(16px + env(safe-area-inset-bottom)); }
.site-credit.in-cover { padding: 0; margin-top: 22px; }

/* 圖片防存檔（搭配 assets/js/protect.js）：禁止長按跳出「儲存圖片」、拖曳、反白 */
img, video, canvas, svg { -webkit-touch-callout: none; -webkit-user-drag: none; user-select: none; -webkit-user-select: none; }

/* 照片浮水印（protect.js 加進照片容器；文字在後台「時間與頁面」設定）：小字、半透明、右下角 */
.wm { position: absolute; right: 10px; bottom: 8px; z-index: 3; max-width: calc(100% - 20px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; pointer-events: none; user-select: none; -webkit-user-select: none; font: 400 .62rem/1.2 var(--serif); letter-spacing: .06em; color: #fff; opacity: .75; text-shadow: 0 0 3px rgba(0,0,0,.85), 0 0 1px rgba(0,0,0,.8), 0 1px 2px rgba(0,0,0,.5); }
.gal-story-pic, .pt-open, .iv-arch, .iv-collage figure, .lb-stage { position: relative; }
.lb-stage .wm { right: 14px; bottom: 14px; z-index: 5; }
