/* ============================================================
   modern-2026.css — 排版現代化附加層
   2026-08-21 加入。本檔只做「疊加」,不修改 style.css / index.css,
   移除本檔的 <link> 即可完整還原成原樣。
   ============================================================ */

:root{
  /* 原本只有 "微軟正黑體"(Windows 專屬),Mac / iOS / Android / Linux 會退回
     瀏覽器預設字型。這裡補齊各平台的正體中文字型,並保留微軟正黑體給 Windows。*/
  --cjk-stack:
    system-ui, -apple-system, "Segoe UI", Roboto,
    "PingFang TC", "Hiragino Sans TC",
    "Noto Sans TC", "Noto Sans CJK TC", "Source Han Sans TC",
    "微軟正黑體", "Microsoft JhengHei",
    "Helvetica Neue", Arial, sans-serif;
  --nv-green: #76b900;
}

body, .web-content, input, textarea, select, button{
  font-family: var(--cjk-stack) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "palt" 1;      /* 中文標點視覺調整 */
}

/* 中文行距:原本 1.5 偏擠 */
body, p, li, td, dd, .content, .subtitle{ line-height: 1.75; }
.title{ line-height: 1.35; letter-spacing: .01em; }

/* 中英數混排的斷行,避免長網址撐破版面 */
p, li, .subtitle, .content, .card, td{ overflow-wrap: break-word; }

/* 標題響應式字級:桌機維持原尺寸,手機自動縮小不再爆版 */
.title.is-1{ font-size: clamp(1.9rem, 5.2vw, 3rem)   !important; }
.title.is-2{ font-size: clamp(1.7rem, 4.4vw, 2.5rem) !important; }
.title.is-3{ font-size: clamp(1.5rem, 3.6vw, 2rem)   !important; }
.title.is-4{ font-size: clamp(1.25rem, 2.8vw, 1.5rem)!important; }
.title.is-5{ font-size: clamp(1.1rem, 2.2vw, 1.25rem)!important; }
.subtitle.is-5{ font-size: clamp(1rem, 2vw, 1.25rem) !important; }
.subtitle.is-6{ font-size: clamp(.95rem, 1.8vw, 1rem)!important; }

/* 小螢幕正文放大,並收斂過寬的留白 */
@media screen and (max-width: 768px){
  html{ font-size: 17px; }
  .hero-body{ padding: 2.5rem 1.25rem; }
  .section{ padding: 2rem 1rem; }
}

/* Minecraft 像素字保留原用途,只補上後備字型避免缺字 */
.PageButton, .PageButton .small{
  font-family: "Minecraft", var(--cjk-stack) !important;
}

/* 圖片一律等比縮放,避免變形與版面位移 */
img{ max-width: 100%; height: auto; }

/* 「活動已結束」提示:外觀近似原本的按鈕,但明確不可點 */
.event-ended{
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .85rem 1.5rem;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 6px;
  background: rgba(255,255,255,.06);
  color: #d6d6d6;
  font-size: 1.05rem;
  line-height: 1.4;
  cursor: default;
  user-select: none;
}
.event-ended .icon{ opacity: .75; }

/* 鍵盤操作可見焦點(2026 無障礙基本要求) */
a:focus-visible, button:focus-visible, .button:focus-visible{
  outline: 2px solid var(--nv-green);
  outline-offset: 2px;
}

/* 尊重使用者的「減少動態」偏好 */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
