:root {
  --accent: #C9A961;
  --accent-dark: #A88940;
  --accent-light: #E5C883;
  --accent-bg: #FAF6EB;
  --on-accent: #1a1a1a;
}
body { font-family: "Noto Sans TC", -apple-system, "PingFang TC", sans-serif; -webkit-font-smoothing: antialiased; }
.serif { font-family: "Noto Serif TC", "PingFang TC", serif; letter-spacing: 0.02em; }
.eyebrow { text-transform: uppercase; letter-spacing: 0.12em; font-size: 11px; font-weight: 500; color: #737373; }
.numerals { font-variant-numeric: tabular-nums; }
.gold-line::after { content: ''; display: block; width: 36px; height: 2px; background: var(--accent); margin-top: 12px; }
.gold-line-sm::after { content: ''; display: block; width: 24px; height: 1px; background: var(--accent); margin-top: 8px; }
.accent-text { color: var(--accent); }
.accent-bg { background-color: var(--accent); }
.accent-bg-light { background-color: var(--accent-bg); }
.on-accent-text { color: var(--on-accent); }
.nav-active { background-color: var(--accent-bg); color: var(--accent-dark); font-weight: 600; }
.hero-card { background: linear-gradient(135deg, #1a1a1a 0%, var(--accent-dark) 65%, var(--accent) 100%); }
.divider-v { width: 1px; height: 56px; background: rgba(255,255,255,0.18); }
/* ── Mobile fixes (擋字 + padding + bg) ── */
@media (max-width: 767px) {
  body { background-color: #fff !important; }
  /* 漢堡縮一點 */
  #mMenuToggle { top: 10px !important; left: 10px !important; padding: 8px !important; border-radius: 10px !important; }
  /* main 內第一個 div 通常是 top bar（高 76px）、推右避免被漢堡擋 */
  main > div:first-child { padding-left: 60px !important; padding-right: 12px !important; }
  /* 內容區 padding 縮小（針對 p-8/p-10/p-12 class）*/
  main > div[class*="p-8"], main > div[class*="p-10"], main > div[class*="p-12"] { padding: 16px !important; }
}
/* ── Mobile top bar tight + flush-left ── */
@media (max-width: 767px) {
  main > div:first-child {
    padding-left: 4px !important;
    padding-right: 8px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
  }
  #mMenuToggle.m-inline { padding: 6px !important; margin: 0 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; }
  #mMenuToggle.m-inline svg { width: 22px !important; height: 22px !important; }
}
/* ── Mobile hamburger placement fix ── */
@media (max-width: 767px) {
  body.m-drawer-open #mMenuToggle { visibility: hidden; }
  #mMenuToggle.m-inline { position: static !important; box-shadow: none !important; border: none !important; background: transparent !important; padding: 8px !important; margin-right: 4px !important; }
}
/* ── Mobile sticky top bar (擋下層 H1)── */
@media (max-width: 767px) {
  main > div:first-child {
    position: sticky !important;
    top: 0 !important;
    z-index: 30 !important;
    background-color: #fff;
  }
}
/* ── Mobile Safari fill (用 lvh 撐到 URL bar 後面)── */
@media (max-width: 767px) {
  aside { height: 100vh !important; height: 100lvh !important; }
  aside > div:last-child { padding-bottom: max(1rem, env(safe-area-inset-bottom, 1rem)) !important; }
}
/* ── Mobile drawer rounded corner + body scroll (Safari URL bar 縮)── */
@media (max-width: 767px) {
  aside { border-top-right-radius: 0 !important; border-bottom-right-radius: 16px !important; overflow: hidden; }
  /* 改成 body 自然滾動、Safari 才會縮 URL bar */
  html, body { overflow-x: hidden; }
  body { overflow-y: auto !important; -webkit-overflow-scrolling: touch; }
  div.flex.h-screen { height: auto !important; min-height: 100vh; }
  main.flex-1.overflow-y-auto, main.flex-1 { overflow: visible !important; height: auto !important; }
}
/* ── Mobile drawer (Phase 1 mobile RWD) ── */
@media (max-width: 767px) {
  aside { position: fixed !important; top: 0; bottom: 0; left: 0; width: min(85vw, 280px) !important; z-index: 50; transform: translateX(-100%); transition: transform 0.25s ease; box-shadow: 4px 0 24px rgba(0,0,0,0.15); }
  aside.m-open { transform: translateX(0); }
  aside { height: 100dvh !important; max-height: 100dvh !important; }
  body.m-drawer-open { overflow: hidden; }
}
/* 隱藏側邊欄(nav)與內容區(main)的灰色捲軸、保留滾動功能 */
nav::-webkit-scrollbar, main::-webkit-scrollbar, .overflow-x-auto::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none; }
nav, main, .overflow-x-auto { scrollbar-width: none; -ms-overflow-style: none; }
