/* ===== 主題變數 ===== */
html[data-theme="dark"]{
--bg:#0b0d12; --page-bg:linear-gradient(135deg,#0b0d12,#121826);
--card:#111520; --muted:#7c8aa0; --text:#eaf1ff;
--accent:#6aa3ff; --accent2:#9d7bff; --border:#1f2535; --header-bg:rgba(16,20,29,.7);
}
html[data-theme="light"]{
--bg:#f6f8ff; --page-bg:linear-gradient(135deg,#f6f8ff,#e9efff);
--card:#ffffff; --muted:#54637a; --text:#0b1324;
--accent:#3a74ff; --accent2:#7b5bff; --border:#d9e0f2; --header-bg:rgba(255,255,255,.88);
}
/* ===== 全域 ===== */
*{box-sizing:border-box}
html,body{height:100%}
body{
margin:0; font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
background:var(--page-bg); color:var(--text);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
/* ===== Header / Nav ===== */
.site-header{
position:sticky; top:0; z-index:1001; /* 提高層級，位於遮罩之上、抽屜之下 */
display:flex; align-items:center; justify-content:space-between;
padding:12px 16px; background:var(--header-bg); backdrop-filter:blur(8px);
border-bottom:1px solid var(--border);
}
.logo a{font-weight:800;letter-spacing:.3px}
.nav{display:flex;gap:10px;align-items:center}
.nav a{padding:8px 10px;border-radius:10px}
.nav a:hover{background:rgba(0,0,0,.08)}
.actions{display:flex;gap:10px;align-items:center}
.theme-toggle,.hamburger{
background:transparent;border:1px solid var(--border);color:var(--text);
border-radius:10px;padding:8px 10px;cursor:pointer
}
.btn{background:var(--accent);color:#061022;padding:8px 14px;border-radius:10px;font-weight:700;border:0}
.btn.outline{background:transparent;border:1px solid var(--border);color:var(--text)}
/* ===== 區塊（示例） ===== */
.hero{display:grid;place-items:center;padding:80px 20px}
.grid{display:grid;gap:16px}
.grid.cards{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));padding:24px}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.card h3{margin:0 0 8px}
.list{padding:24px}
.list-item{display:block;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;margin-bottom:12px}
.site-footer{padding:20px;text-align:center;color:var(--muted);border-top:1px solid var(--border);background:var(--bg)}
/* 聯絡列表（若有） */
.contact-list{list-style:none;margin:0 0 12px;padding:0}
.contact-list li{display:flex;align-items:flex-start;gap:8px;margin-bottom:10px;line-height:1.6}
.contact-list i{color:var(--accent);min-width:20px;margin-top:3px}
/* ===== 顯示規則：桌面 vs 手機 ===== */
.hamburger{display:none}
.desktop-only{display:flex;gap:10px;align-items:center}
/* 桌面隱藏手機登入區 */
.nav-auth{display:none;}
@media (max-width:720px){
.hamburger{display:inline-block}
.desktop-only{display:none}
/* 無 JS 後援：手機預設直接顯示縱向選單（避免整個不見） */
.nav{
display:block; padding:12px 14px;
background:var(--bg); border-top:1px solid var(--border);
}
.nav-auth{display:grid; gap:8px; margin-top:8px}
}
/* 有 JS 時抽屜化（header.php 已在 加 .js） */
@media (max-width:720px){
html.js .nav{
position: fixed;
/* 由 JS 設定 --header-h，確保抽屜從 header 底下開始；加 iOS 安全區 */
top: calc(var(--header-h, 64px) + env(safe-area-inset-top));
left: 0; right: 0; bottom: 0;
display: none;
flex-direction: column; gap: 8px; padding: 14px;
background: var(--bg); border-top: 1px solid var(--border);
box-shadow: 0 8px 20px rgba(0,0,0,.25);
z-index: 1002; /* 抽屜層級 */
overflow: auto; -webkit-overflow-scrolling: touch; /* 抽屜可滾動 */
}
html.js .nav.open{ display:flex }
/* 手機抽屜遮罩（點擊關閉） */
.nav-backdrop{
position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 1000;
}
.nav-backdrop[hidden]{ display:none }
/* 其他手機微調 */
.nav a,.nav .btn{ display:block; width:100% }
.grid.cards{ grid-template-columns:1fr; padding:14px }
.card{ border-radius:14px; padding:14px }
.list{ padding:16px }
.btn,button{ width:100% }
body.no-scroll{ overflow:hidden }
}
/* 可選：檢查頁（如有） */
.progress{width:100%;background:var(--border);border-radius:10px;overflow:hidden;margin:6px 0 0;height:10px}
.bar{height:100%;width:0%;background:var(--accent);animation:grow 2.5s linear forwards}
@keyframes grow{from{width:0%}to{width:100%}}