/* =====================================================================
   2026 全國電競青年錦標賽 × KAOHSIUNG ESPORTS SHOWDOWN — 全站樣式
   設計稿：首頁_不同尺寸.psd（1200／810／390）、賽事規章.psd、賽事時間表.psd（1200）

   命名規則（BEM）
   - 一律 ye- 開頭：區塊 ye-{區塊}、元素 ye-{區塊}__{元素}、變化 ye-{區塊}--{變化}
   - 狀態 is-*（is-open、is-empty、is-on）
   - body：全站 ye-site；首頁加 ye-site--home、內頁加 ye-site--inner
   - 頁面區塊與檔名同名：ye-rule（*_rule.php）、ye-game（*_game.php）
   - 自訂屬性（CSS 變數）一律完整單字：--stretch、--logo-h、--banner-shift…

   目錄
   1. 字型與全站變數   2. 圖片佔位   3. Header／選單   4. 首頁（KV、賽事介紹、跑馬燈、獎金）
   5. Footer   6. 選單當頁標示   7. 內頁共用（背景、footer 上方區塊）   8. 賽事規章   9. 賽事時程   10. 校園講座
   ===================================================================== */

/* 字型
   - Cubic 11（俐方體11號，SIL OFL 可商用）：PSD 選單、名次、金額用字，已放在 fonts/
   - CHOXR（PSD 英文大標）非公開字型，網頁以 League Gothic（SIL OFL）垂直拉長 --stretch 倍模擬；要完全一致可改用圖片
   - jf 金萱（footer 標籤）為付費字型，以 Noto Sans TC 900 替代 */
@font-face {
  font-family: 'League Gothic';
  src: url('../fonts/LeagueGothic.woff2') format('woff2');
  font-display: swap;
}
@font-face {
  font-family: 'Cubic 11';
  src: url('../fonts/Cubic_11.woff2') format('woff2');
  font-display: swap;
}

.ye-site {
  --ye-orange: #fc5a13;
  --ye-orange-2: #ff6d02;
  --ye-ink: #191919;
  --ye-header-h: 72px;
  --ye-pixel: 'Cubic 11', 'DotGothic16', monospace;
  --ye-display: 'League Gothic', 'Oswald', 'Arial Narrow', sans-serif;
  background: #d7d6d6 !important;
  color: var(--ye-ink);
}

/* ─── 圖片佔位（圖片上傳後自動失效） ─────────────── */
.ye-placeholder { display: block; position: relative; }
.ye-placeholder.is-empty {
  background: repeating-linear-gradient(45deg, rgba(0,0,0,.05) 0 12px, transparent 12px 24px), #bdbdbd;
  outline: 1px dashed #8a8a8a; outline-offset: -1px;
}
.ye-placeholder.is-empty::after {
  content: attr(data-placeholder);
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  padding: 4px 10px; max-width: 95%;
  font: 500 13px/1.4 'Noto Sans TC', sans-serif; color: #444;
  background: rgba(255,255,255,.8);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ye-placeholder.is-empty img { position: absolute; inset: 0; }
.ye-placeholder--logo.is-empty   { width: 98px; height: 35px; }
.ye-placeholder--logo.is-empty::after { content: 'logo.png'; font-size: 11px; padding: 2px 4px; }
.ye-placeholder--kv.is-empty     { aspect-ratio: 1200 / 625; }
@media (max-width: 1023px) { .ye-placeholder--kv.is-empty { aspect-ratio: 810 / 675; } }
.ye-placeholder--banner.is-empty { aspect-ratio: 864 / 54; background: #080a17; outline-color: #333; }
.ye-placeholder--banner.is-empty::after { background: none; color: #bbb; }
.ye-placeholder--chip {
  display: inline-flex; align-items: center; justify-content: center;
  height: 36px; padding: 0 14px;
  font: 500 13px/1 'Noto Sans TC', sans-serif; color: #555;
  background: #c4c4c4; border: 1px dashed #999; white-space: nowrap;
}
.ye-placeholder--chip.is-round { width: 50px; height: 50px; padding: 0; border-radius: 50%; font-size: 0; }

/* ─── Header（高 72，底線 #b0aeb1） ─────────────── */
.ye-site .main-header {
  position: relative;
  background: #dad8d2;
  border-bottom: 3px solid #b0aeb1;
}
.ye-site .main-header .header-container { max-width: none; margin: 0; } /* responsive.css 1140–1299 會加 50px 左右 margin */
.ye-site .header-style-two .header-upper .container-fluid { padding: 0 45px 0 25px; }
.ye-site .header-style-two .header-upper .inner-container-fulid {
  display: flex; align-items: center; justify-content: space-between;
  height: calc(var(--ye-header-h) - 3px);
}
.ye-site .header-style-two .header-upper .logo-box {
  float: none; height: auto; width: auto; padding: 0; position: relative; top: 0; background: none; /* 蓋掉 responsive.css ≤1023 的 padding */
}
.ye-site .main-header .header-upper .logo img { height: 35px; width: auto; }
.ye-site .header-style-two .nav-outer { float: none; padding: 0; margin-left: auto; }
.ye-site .header-style-two .header-upper .inner-container-fulid::after,
.ye-site .sticky-header > .container-fluid::after { display: none; } /* clearfix 偽元素會擠進 flex */
.ye-site .main-menu .navigation { align-items: center; }
.ye-site .header-style-two .main-menu .navigation > li { padding: 14px 0; margin-right: 36px; }
.ye-site .header-style-two .main-menu .navigation > li:last-child { margin-right: 0; }
.ye-site .header-style-two .main-menu .navigation > li > a {
  font-family: var(--ye-pixel);
  font-size: 14.4px; line-height: 20px; font-weight: 400;
  letter-spacing: .3em; margin-right: -.3em; /* 抵銷最後一字的字距 */
  color: #262626; padding: 4px 0; cursor: pointer;
}
.ye-site .main-menu .navigation > li:hover > a,
.ye-site .main-menu .navigation > li.current > a {
  color: var(--ye-orange); text-shadow: none;
}
.ye-site .main-menu .navigation > li > ul { border-radius: 0; border-top: 3px solid var(--ye-orange); margin-top: 0; }
.ye-site .main-menu .navigation > li > ul > li > a { font-family: var(--ye-pixel); letter-spacing: .15em; }
.ye-site .main-menu .navigation > li > ul > li:hover > a { color: var(--ye-orange); }
/* 漢堡鈕：依 PSD 畫三條 32×8 的線，不依賴 flaticon */
.ye-site .main-header .mobile-nav-toggler {
  position: relative; width: 32px; height: 28px; margin: 0; float: none;
}
.ye-site .main-header .mobile-nav-toggler .icon { display: none; }
.ye-site .main-header .mobile-nav-toggler::before {
  content: ''; position: absolute; left: 0; top: 0;
  width: 32px; height: 8px; background: #1c1c1c;
  box-shadow: 0 10px 0 #1c1c1c, 0 20px 0 #1c1c1c;
}

/* sticky header 同步淺色 */
.ye-site .sticky-header { background: #dad8d2; border-bottom: 3px solid #b0aeb1; }
.ye-site .sticky-header > .container-fluid {
  display: flex; align-items: center; justify-content: space-between;
  height: 69px; padding: 0 45px 0 25px;
}
.ye-site .sticky-header .logo { padding: 0 !important; }
.ye-site .sticky-header .logo img { height: 35px; width: auto; }
.ye-site .sticky-header .main-menu .navigation > li > a {
  font-family: var(--ye-pixel); font-size: 14.4px; letter-spacing: .3em; color: #262626;
}
.ye-site .sticky-header .main-menu .navigation > li:hover > a { color: var(--ye-orange); }

/* ─── KV + Banner ───────────────────────────── */
.ye-kv { position: relative; z-index: 10; } /* 讓 banner 壓在下一個區塊上面 */
.ye-kv img#index-title { display: block; width: 100%; height: auto; }
/* Banner 不佔版面高度：貼在 KV 底邊，跨在 KV 與賽事介紹兩個區塊中間
   --banner-shift＝banner 往下移出 KV 的比例，依各畫板實測：
   桌機 76%（PSD banner 684–738、KV 底 697，只壓 KV 13px，避開 KV 底部的 YOUTH ESPORTS 線）
   平板 50%、手機 38% */
.ye-banner {
  --banner-shift: 76%;
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 5;
  transform: translateY(var(--banner-shift));
  padding: 0 16px;
}
@media (max-width: 1023px) { .ye-banner { --banner-shift: 50%; } } /* 平板 KV（kv_t）時 */
.ye-site .ye-banner .slider { width: 72%; max-width: 1382px; margin: 0 auto; overflow: hidden; }
.ye-site .ye-banner .slides { display: flex; transition: transform .5s ease-in-out; }
.ye-site .ye-banner .slide { min-width: 100%; }
.ye-site .ye-banner .slide img { display: block; width: 100%; }

/* ─── 主內容背景（PSD「圖層 9」，KV 以下整片） ───── */
.ye-site--home .page-wrapper.ye-main {
  margin-top: 0 !important;
  overflow: hidden;
  background: #d7d6d6;
}
.ye-container { max-width: 848px; margin: 0 auto; padding: 0 24px; }

/* 英文大標：League Gothic 垂直拉長，貼近 PSD 的 CHOXR */
.ye-stretch {
  display: block;
  font-family: var(--ye-display); font-weight: 400;
  line-height: .8; white-space: nowrap; text-transform: uppercase;
  transform: scaleY(var(--stretch, 1.5));
  transform-origin: 0 0;
  margin-bottom: calc((var(--stretch, 1.5) - 1) * .8em);
}

/* ─── 賽事介紹（PSD：橫式照片框 488×337、間距 41、文字欄 396 寬） ─── */
.ye-intro {
  padding: calc(47px + 3.42vw) 0 209px; /* 47px＝PSD banner 底到照片；3.42vw＝banner 伸進本區的高度（72vw×54/864×76%）；209px＝PSD 照片框底到跑馬燈 */
  /* PSD 背景：圖層 9 紋理＋圖層 3 弧形光（濾色）＋兩個向量圖智慧型物件（分割／線性加亮），已合成為 1200×624 */
  background: url(../images/home_intro_bg.jpg) center top / cover no-repeat #e0dfe0;
}
.ye-intro > .ye-container { max-width: 973px; } /* 488＋41＋396＋左右 24 */
.ye-intro__row { display: flex; align-items: flex-start; gap: 41px; }
.ye-intro__pic { flex: 0 0 488px; position: relative; z-index: 0; }
/* 照片後方的斜向光束（PSD 圖層 658，不透明度 36%），跟著照片定位 */
.ye-intro__pic::before {
  content: ''; position: absolute; z-index: -1;
  left: 30.53%; top: 21.36%; width: 122.13%; height: 117.21%;
  background: url(../images/home_intro_beam.png) left top / 100% 100% no-repeat;
  pointer-events: none;
}
/* 照片＋金屬框：框為去背 PNG，照片從框的鏤空處露出 */
/* 照片＋金屬框＋陰影為同一張圖（512×361），框本體 488×337，四周多 12px 陰影 */
.ye-intro__photo { position: relative; aspect-ratio: 488 / 337; }
.ye-intro__photo-img {
  position: absolute; left: -2.459%; top: -3.561%; width: 104.918%; height: 107.122%;
  display: block; max-width: none;
}
.ye-intro__text { flex: 1; min-width: 0; padding-top: 0; } /* 標題與照片框上緣對齊 */
.ye-intro__title { margin: 0 0 21px; color: #010202; }
.ye-intro__title-en { --stretch: 1.52; font-size: 50.3px; }
.ye-intro__title-zh {
  display: block; margin-top: 7px;
  font-size: 29.9px; line-height: 1; font-weight: 700;
  letter-spacing: .5em; color: #06070a;
}
.ye-intro__desc {
  font-size: 17.7px; line-height: 1.19; font-weight: 500;
  color: var(--ye-orange);
}

/* ─── Sponsor ticker（高 135，#353535） ─────── */
.ye-site .ye-ticker .sponsor-bar {
  background: #353535; border: 0;
  height: 135px; padding: 0;
  display: flex; align-items: center;
  -webkit-mask-image: none; mask-image: none;
}
.ye-site .ye-ticker .sponsor-set { gap: 42px; padding: 0 21px; }
/* 每個 logo 的顯示高度寫在 HTML 的 --h（PSD 實測 px），--logo-scale 為各尺寸的縮放 */
.ye-site .ye-ticker .sponsor-item img { height: calc(var(--logo-h, 34) * var(--logo-scale, 1) * 1px) !important; width: auto; }
.ye-site .ye-ticker .ye-placeholder--chip { background: #4a4a4a; color: #ccc; border-color: #666; }

/* ─── Prize pool ─────────────────────────────── */
.ye-prize {
  padding: 64px 0 37px;
  position: relative; overflow: hidden;
  /* PSD 背景：紋理＋BG（明度 33%）＋程式碼文字，已合成為 1200×1404 */
  background: url(../images/home_prize_bg.jpg) center top / cover no-repeat #c2c1c1;
}
.ye-prize > .ye-container { position: relative; z-index: 1; }
/* 鍊條＋像素柱：貼齊畫面左右，大小跟著視窗寬度等比（1200 寬時為 PSD 原尺寸） */
.ye-prize__deco { position: absolute; z-index: 0; height: auto; pointer-events: none; user-select: none; }
.ye-prize__deco--tl { left: 0;  top: 228px; width: clamp(128px, 22.17vw, 359px); }
.ye-prize__deco--tr { right: 0; top: 228px; width: clamp(132px, 23vw, 373px); }
.ye-prize__deco--bl { left: 0;  bottom: 0;  width: clamp(122px, 21.17vw, 343px); }
.ye-prize__deco--br { right: 0; bottom: 0;  width: clamp(120px, 20.92vw, 339px); }
.ye-prize__title {
  --stretch: 1.78;
  font-size: 76.5px; color: #121212;
  text-align: center; transform-origin: 50% 0;
  margin-top: 0;
}
.ye-prize__title.ye-stretch { margin-bottom: calc(.78 * .8em + 25px); }

/* 總獎金卡：外框圖 749×266，內部文字以 cqw 等比縮放 */
.ye-pool {
  width: min(749px, 100%);
  margin: 0 auto;
  container-type: inline-size;
}
.ye-pool__inner {
  position: relative;
  aspect-ratio: 749 / 266;
  background: url(../images/home_prize_frame.png) center / 100% 100% no-repeat;
}
.ye-pool__tag {
  position: absolute; left: 8.14cqw; top: 1.2cqw;
  font-size: 2.8cqw; line-height: 1.3; font-weight: 700; color: #f6f6f6;
}
.ye-pool__label {
  position: absolute; left: 10.28cqw; top: 12.6cqw;
  display: flex; flex-direction: column; align-items: flex-start;
  color: var(--ye-orange-2); line-height: 1;
}
.ye-pool__label-zh {
  font-size: 4.71cqw; font-weight: 500; letter-spacing: .3em; margin-right: -.3em;
}
.ye-pool__label-en { --stretch: 1.53; font-size: 5.57cqw; margin-top: .7cqw; }
.ye-pool__amount {
  position: absolute; left: 28.8cqw; top: 12.2cqw;
  font-family: var(--ye-pixel);
  font-size: 14.87cqw; line-height: 1;
  color: var(--ye-orange-2);
  white-space: nowrap;
}
.ye-pool__amount small {
  font-size: .25em; margin-left: .15em; letter-spacing: 0;
}

/* YOUTH ESPORTS 分隔線（551×36 圖） */
.ye-divider { width: min(551px, 68vw); margin: 26px auto 20px; }
.ye-divider img { display: block; width: 100%; height: auto; }
.ye-divider--end { display: none; }

/* 名次列表：PSD 寬 488，字 48 / 58.7 / 20.4，列距 65.7 */
.ye-rank {
  width: min(488px, 63vw);
  margin: 0 auto 35px;
  padding: 0;
  container-type: inline-size;
}
.ye-rank li {
  display: flex; align-items: baseline; justify-content: space-between;
  height: 13.46cqw;
  font-family: var(--ye-pixel); color: var(--ye-ink); line-height: 1;
  -webkit-text-stroke: .025em currentColor; /* PSD 有加粗 */
}
.ye-rank__name  { font-size: 9.86cqw; }
.ye-rank__money { font-size: 12.03cqw; white-space: nowrap; }
.ye-rank__money small { font-size: .348em; margin-left: .55em; }
.ye-prize .ye-rank:last-of-type { margin-bottom: 0; }

/* ─── Footer（#d7d6d6，列距 80） ───────────────── */
.main-footer.ye-footer {
  background: #d7d6d6; padding: 44px 0 0; border-radius: 0 !important;
}
.ye-footer__row {
  display: flex; align-items: center;
  gap: 24px; margin: 0 0 38px;
}
.ye-footer__row dt {
  flex: 0 0 auto;
  font-size: 21.3px; line-height: 1; font-weight: 900; color: #1c1d1d;
  letter-spacing: .3em; white-space: nowrap;
}
.ye-footer__row dd { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 22px; margin: 0; }
.ye-footer__row dd img { height: calc(var(--logo-h, 38) * var(--logo-scale, 1) * 1px); width: auto; }
/* 桌機／平板：footer 照 PSD 一列排完不斷行
   --footer-left＝左側起點：寬螢幕時對齊 PSD 的 x=238（1200 設計區內），窄時最少 24px
   --footer-scale＝縮放（1px＝PSD 原尺寸）：可用寬度不足 820px（PSD 最長一列 798px＋餘裕）時，logo、標籤字、間距一起等比縮小 */
@media (min-width: 768px) {
  .ye-footer .ye-container {
    --footer-left: max(24px, calc(50vw - 362px));
    --footer-scale: min(1px, calc((100vw - var(--footer-left) - 24px) / 820));
    max-width: none; margin: 0; padding: 0 0 0 var(--footer-left);
  }
  .ye-footer__row { flex-wrap: nowrap; gap: calc(24 * var(--footer-scale)); margin-bottom: calc(38 * var(--footer-scale)); }
  .ye-footer__row dt { font-size: calc(21.3 * var(--footer-scale)); }
  .ye-footer__row dd { flex-wrap: nowrap; gap: calc(22 * var(--footer-scale)); }
  .ye-footer__row dd img { height: calc(var(--logo-h, 38) * var(--footer-scale)); }
}
.ye-footer .footer-bottom { background: #cbcaca; padding: 14px 0; margin-top: 30px; }
.ye-footer .footer-bottom .copyright { color: #555; font-size: 13px; }
.ye-site .scroll-to-top { background: #353535; box-shadow: 2px 2px 0 var(--ye-orange); }

/* ═══ WEB 2（810）：選單縮小、介紹欄縮窄 ═══════════════ */
@media (max-width: 1199px) {
  .ye-site .header-style-two .main-menu .navigation > li { margin-right: 24px; }
  .ye-site .header-style-two .main-menu .navigation > li > a,
  .ye-site .sticky-header .main-menu .navigation > li > a { font-size: 12.2px; }
  .ye-site .header-style-two .header-upper .container-fluid,
  .ye-site .sticky-header > .container-fluid { padding: 0 30px 0 25px; }
  .ye-site .ye-banner .slider { width: 73.5%; }
  .ye-intro { padding-top: calc(36px + 3.34vw); padding-bottom: 288px; } /* 平板 banner 半高：73.5vw × 54/595 ÷ 2；288px＝PSD 照片框底到跑馬燈 */
  .ye-container { max-width: 752px; }
  .ye-intro > .ye-container { max-width: 763px; } /* 353＋12＋350＋左右 24 */
  .ye-intro__row { gap: 12px; }
  .ye-intro__pic { flex-basis: 353px; }
  .ye-intro__text { padding-top: 4px; }
  .ye-intro__title-en { font-size: 44.6px; }
  .ye-intro__title-zh { font-size: 26.5px; }
  .ye-intro__desc { font-size: 15.7px; }
  .ye-divider--end { display: block; margin: 16px auto 0; }
}

/* 767 以下選單放不下 → 改漢堡（舊站 script.js 會把選單複製進 .mobile-menu） */
@media (max-width: 767px) {
  .ye-site .main-header .nav-outer .main-menu { display: none !important; }
  .ye-site .main-header .mobile-nav-toggler { display: block !important; }
}
@media (min-width: 768px) {
  .ye-site .main-header .nav-outer .main-menu { display: block !important; }
  .ye-site .main-header .mobile-nav-toggler { display: none !important; }
}
@media (min-width: 768px) and (max-width: 860px) {
  .ye-site .header-style-two .main-menu .navigation > li { margin-right: 16px; }
  .ye-site .header-style-two .main-menu .navigation > li > a { letter-spacing: .2em; margin-right: -.2em; }
}

/* ═══ WEB 3（390）═════════════════════════════════ */
@media (max-width: 767px) {
  .ye-site .header-style-two .header-upper .container-fluid { padding: 0 22px 0 20px; }
  .ye-placeholder--kv.is-empty { aspect-ratio: 390 / 397; }
  .ye-site .ye-banner .slider { width: 69%; }
  .ye-placeholder--banner.is-empty { aspect-ratio: 270 / 34; }

  .ye-banner { --banner-shift: 38%; }
  .ye-intro { padding: calc(17px + 3.3vw) 0 49px; } /* banner 伸進本區：69vw × 34/270 × 38% */
  .ye-intro__row { flex-direction: column; align-items: center; gap: 0; }
  .ye-intro__pic { flex: none; width: min(332px, 100%); }
  .ye-intro__pic::before { display: none; } /* 手機版設計沒有這道光束 */
  .ye-prize__deco--tl, .ye-prize__deco--tr { top: 49px; }
  .ye-intro__text { width: min(287px, calc(100% - 45px)); padding-top: 18px; }
  .ye-intro__title { margin-bottom: 15px; }
  .ye-intro__title-en { font-size: 34.7px; }
  .ye-intro__title-zh { font-size: 21.5px; margin-top: 7px; }
  /* 新版 PSD 手機內文 15.6px；PSD 行高 1 是假字，實際中文標點會擠在一起，放寬到 1.3 */
  .ye-intro__desc { font-size: 15.6px; line-height: 1.3; }

  .ye-site .ye-ticker .sponsor-bar { height: 110px; }
  .ye-site .ye-ticker .sponsor-set { gap: 30px; }
  .ye-site .ye-ticker .sponsor-item { --logo-scale: .8; }

  .ye-prize { padding: 16px 0 34px; }
  .ye-container { padding: 0 14px; }
  .ye-prize__title { font-size: 36.8px; }
  .ye-prize__title.ye-stretch { margin-bottom: calc(.78 * .8em + 12px); }
  .ye-divider { margin: 12px auto 10px; }
  .ye-rank { margin-bottom: 14px; }
  .ye-divider--end { margin-top: 8px; }

  .main-footer.ye-footer { padding-top: 20px; }
  .ye-footer .ye-container { padding: 0 20px 0 42px; }
  .ye-footer__row { align-items: flex-start; gap: 13px; margin-bottom: 20px; }
  .ye-footer__row dt { font-size: 13px; line-height: 25px; }
  .ye-footer__row dd { gap: 8px 12px; }
  .ye-footer__row { --logo-scale: .6; }
  .ye-placeholder--chip { height: 23px; }
  .ye-placeholder--chip { font-size: 11px; padding: 0 8px; }
  .ye-placeholder--chip.is-round { width: 30px; height: 30px; }
}

/* =====================================================================
   選單「當頁」標示（全站）：目前所在單元＝橘字＋底線，子選單當頁也標橘色
   （menu.php 會依檔名自動加上 .current）
   ===================================================================== */
.ye-site .header-style-two .main-menu .navigation > li.current > a,
.ye-site .sticky-header .main-menu .navigation > li.current > a { color: var(--ye-orange); }
.ye-site .main-menu .navigation > li.current > a::after {
  content: ''; position: absolute; left: 0; right: .3em; bottom: -2px;
  height: 2px; background: var(--ye-orange);
}
.ye-site .main-menu .navigation > li > ul > li.current > a { color: var(--ye-orange); }
.ye-site .mobile-menu .navigation li.current > a { color: var(--ye-orange); }

/* =====================================================================
   內頁共用（body.ye-site--inner）：大背景＋ footer 上方小區塊
   設計稿：賽事規章.psd（1200 寬）
   ===================================================================== */
.ye-site--inner { background: #c8c9ca !important; }
.ye-site--inner .page-wrapper.ye-main {
  margin-top: 0 !important; overflow: hidden;
  /* PSD 圖層 2＋濾色弧形＋智慧型物件，已合成為 1920 寬（超出畫板的部分也一起算出來） */
  background: url(../images/inner_bg.jpg) center top / max(1920px, 100%) auto no-repeat #c8c9ca;
}
.ye-site--inner .main-footer.ye-footer { background: transparent; padding-top: 0; }
.ye-site--inner .ye-footer .footer-bottom { background: rgba(0,0,0,.06); }

/* footer 上方：程式碼文字＋ YOUTH ESPORTS 線（寬度對齊內容區 1012） */
.ye-prefoot {
  position: relative; z-index: 0;
  width: min(1012px, calc(100% - 48px)); margin: 103px auto 76px;
}
.ye-prefoot__code {
  position: absolute; left: .6%; top: -213px; width: 52.5%; height: auto;
  pointer-events: none;
}
.ye-prefoot__line { display: block; margin-left: 7.2%; width: 86.5%; height: auto; }

/* ─── 賽事規章 ─────────────────────────────── */
.ye-rule { position: relative; z-index: 1; padding: 110px 0 0; }
.ye-rule__wrap { width: min(1012px, calc(100% - 48px)); margin: 0 auto; text-align: center; }
.ye-page-title {
  margin: 0; color: #111;
  font-size: 82.9px; line-height: 1; font-weight: 900;
  letter-spacing: .3em; margin-right: -.3em;
}
.ye-rule__download {
  display: inline-flex; align-items: center; justify-content: center;
  width: 313px; height: 50px; margin-top: 18px; border-radius: 25px;
  background: #dad8d2; color: #ff5400 !important;
  font-size: 22.4px; font-weight: 900; letter-spacing: .3em; text-indent: .3em;
  transition: background .2s, transform .2s, box-shadow .2s;
}
.ye-rule__download:hover { background: #fff; transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.12); }
.ye-rule__faq-title {
  margin: 38px 0 22px; color: #111;
  font-family: var(--ye-pixel); font-size: 34.8px; line-height: 1; font-weight: 400;
  letter-spacing: .3em; margin-right: -.3em;
}

/* 常見問答（手風琴） */
.ye-faq { text-align: left; }
.ye-faq__item { margin-bottom: 3px; }
.ye-faq__q {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  width: 100%; min-height: 66px; padding: 10px 36px 10px 58px; border: 0; border-radius: 33px;
  background: rgba(218,216,210,.84); color: #111; cursor: pointer; text-align: left;
  font-family: var(--ye-pixel); font-size: 25.8px; line-height: 1.3;
  transition: background .2s;
}
.ye-faq__q:hover { background: rgba(232,230,225,.95); }
.ye-faq__q:focus-visible { outline: 2px solid var(--ye-orange); outline-offset: 2px; }
.ye-faq__icon { position: relative; flex: 0 0 21px; height: 21px; }
.ye-faq__icon::before, .ye-faq__icon::after {
  content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 3px; margin-top: -1.5px; background: #111;
  transition: transform .25s;
}
.ye-faq__icon::after { transform: rotate(90deg); }
.ye-faq__item.is-open .ye-faq__icon::after { transform: rotate(0deg); } /* 展開時變成「－」 */
/* 內容展開：grid 0fr → 1fr 動畫，不用算高度 */
.ye-faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }
.ye-faq__item.is-open .ye-faq__a { grid-template-rows: 1fr; }
.ye-faq__a-inner { overflow: hidden; }
.ye-faq__a-text {
  padding: 17px 57px 13px;
  color: #ff5400; font-family: var(--ye-pixel); font-size: 24px; line-height: 36px;
}

/* ─── 內頁：平板 ─── */
@media (max-width: 1023px) {
  .ye-rule { padding-top: 80px; }
  .ye-page-title { font-size: 64px; }
  .ye-faq__q { min-height: 58px; border-radius: 29px; padding: 10px 28px 10px 40px; font-size: 21px; }
  .ye-faq__a-text { padding: 14px 40px 10px; font-size: 20px; line-height: 32px; }
  .ye-prefoot { margin-top: 80px; }
  .ye-prefoot__code { top: -170px; }
}
/* ─── 內頁：手機 ─── */
@media (max-width: 767px) {
  .ye-site--inner .page-wrapper.ye-main { background-size: 220% auto; }
  .ye-rule { padding-top: 44px; }
  .ye-rule__wrap, .ye-prefoot { width: calc(100% - 28px); }
  .ye-page-title { font-size: 44px; }
  .ye-rule__download { width: 240px; height: 42px; margin-top: 14px; font-size: 17px; }
  .ye-rule__faq-title { font-size: 24px; margin: 30px 0 16px; }
  .ye-faq__q { min-height: 50px; border-radius: 25px; padding: 12px 18px 12px 22px; font-size: 16px; gap: 12px; }
  .ye-faq__icon { flex-basis: 16px; height: 16px; }
  .ye-faq__icon::before, .ye-faq__icon::after { height: 2px; margin-top: -1px; }
  .ye-faq__a-text { padding: 12px 22px 8px; font-size: 15px; line-height: 1.7; }
  .ye-prefoot { margin: 60px auto 40px; }
  .ye-prefoot__code { top: -90px; }
}

/* =====================================================================
   賽事時程（val_game.php／sf_game.php，版型 tpl_game.php）
   設計稿：賽事時間表.psd（1200 寬）
   ===================================================================== */
.ye-game { position: relative; z-index: 1; padding-top: 145px; text-align: center; }
.ye-page-title { text-align: center; }

/* 時程表：三欄膠囊（PSD 欄寬 143／193／296、列距 44.5、#d9d7d1） */
.ye-game__table { width: min(680px, calc(100% - 48px)); margin: var(--game-table-gap, 40px) auto 0; }
.ye-game__row {
  display: grid; grid-template-columns: 143fr 193fr 296fr; column-gap: 24px;
  margin-bottom: 6px;
}
.ye-game__row > span {
  display: flex; align-items: center; justify-content: center; gap: .3em;
  height: 38.5px; border-radius: 15.4px; background: #d9d7d1;
  font-family: var(--ye-pixel); font-size: 23.9px; line-height: 1; color: #111; white-space: nowrap;
  -webkit-text-stroke: .02em currentColor;
}
.ye-game__row > span small { font-size: 15.7px; }
.ye-game__row--head { margin-bottom: 8px; }
.ye-game__row--head > span {
  height: auto; background: none; color: #ff5400;
  letter-spacing: .5em; text-indent: .5em;
}

/* 賽程樹狀圖：畫布 1200 寬，所有座標 ×（容器寬 / 1200）等比縮放 */
.ye-bracket__hint { display: none; margin: 24px 0 -12px; font-size: 13px; color: #555; }
.ye-bracket__hint.is-on { display: block; }
.ye-bracket { margin-top: var(--bracket-gap, 60px); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ye-bracket__canvas {
  position: relative; container-type: inline-size;
  width: max(100%, var(--min-width, 1000px)); max-width: 1200px; margin: 0 auto;
  aspect-ratio: var(--canvas-w) / var(--canvas-h);
}
.ye-bracket__canvas > * {
  --u: calc(100cqw / 1200);
  position: absolute;
  left: calc(var(--x) * var(--u)); top: calc(var(--y) * var(--u));
  width: calc(var(--w) * var(--u)); height: calc(var(--h) * var(--u));
}
.ye-bracket__pill {
  z-index: 2; display: flex; align-items: center; justify-content: center;
  border-radius: 999px; background: #f3f2f0; color: #111;
  font-family: var(--ye-pixel); font-size: calc(var(--font-size) * var(--u)); line-height: 1;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  padding: 0 .4em 0 max(.4em, calc(var(--crown-space, 0) * var(--u))); /* 有皇冠時文字讓位 */
  letter-spacing: .07em; text-indent: .07em; -webkit-text-stroke: .02em currentColor; /* PSD 字距與粗細 */
}
.ye-bracket__pill--beige { background: #e7e5dd; }
.ye-bracket__pill--orange { background: #ff7200; color: #fff; }
/* 連接線：PSD 為圓角矩形只露出「]」半邊 */
.ye-bracket__line { z-index: 1; border: max(1px, var(--u)) solid #111; }
.ye-bracket__line--right { border-left: 0; border-radius: 0 calc(var(--line-radius) * var(--u)) calc(var(--line-radius) * var(--u)) 0; }
.ye-bracket__line--left { border-right: 0; border-radius: calc(var(--line-radius) * var(--u)) 0 0 calc(var(--line-radius) * var(--u)); }
.ye-bracket__round {
  z-index: 2; height: auto; text-align: left; white-space: nowrap;
  font-family: var(--ye-pixel); font-size: calc(15.5 * var(--u)); line-height: 1; color: #111;
  letter-spacing: .1em; -webkit-text-stroke: .02em currentColor;
}
.ye-bracket__round::after {
  content: ''; position: absolute; left: 0; width: 100%;
  top: calc((var(--ry) - var(--y)) * var(--u)); height: max(1px, calc(3 * var(--u))); background: #111;
}
.ye-bracket__crown { z-index: 3; object-fit: contain; }

/* 程式碼文字放右側（時程頁） */
.ye-prefoot--code-right .ye-prefoot__code { left: 79.7%; top: -86px; }

@media (max-width: 1023px) {
  .ye-game { padding-top: 90px; }
}
@media (max-width: 767px) {
  .ye-game { padding-top: 44px; }
  .ye-game__table { width: calc(100% - 28px); margin-top: 24px; }
  .ye-game__row { grid-template-columns: 27fr 25fr 48fr; column-gap: 6px; margin-bottom: 5px; }
  .ye-game__row > span { height: 30px; border-radius: 12px; font-size: 14px; }
  .ye-game__row > span small { font-size: 10px; }
  .ye-game__row--head > span { letter-spacing: .2em; text-indent: .2em; }
  .ye-bracket { margin-top: 36px; padding: 0 14px; }
  .ye-prefoot--code-right .ye-prefoot__code { top: -50px; }
}

/* =====================================================================
   10. 校園講座（lecture.php）
   設計稿：校園講座.psd（1200 寬）；PSD 內容整體偏右約 38px，網頁改為置中
   ===================================================================== */
.ye-lecture { position: relative; z-index: 1; padding: 60px 0 120px; text-align: center; } /* 下方留白：footer 上方的程式碼文字不壓到最後一筆 */

/* 標題：這頁用像素字＋英文副標 */
.ye-page-title--pixel {
  font-family: var(--ye-pixel); font-weight: 400; font-size: 87.7px;
  letter-spacing: 0; margin-right: 0; color: #0c0d0e;
}
.ye-page-title__en {
  display: block; margin-top: 13px;
  font-size: 32.2px; line-height: 1; letter-spacing: 0; text-transform: uppercase;
}

/* 授課講師：2 欄，卡片 346 寬、欄距 34 */
.ye-lecture__teachers {
  --teacher-gap: 34px;
  display: grid; grid-template-columns: repeat(2, 346px); justify-content: center;
  column-gap: var(--teacher-gap); row-gap: 23px;
  margin: 36px auto 0; padding: 0; list-style: none;
}
.ye-lecture__teacher { margin: 0; }
/* 講師人數為單數時，最後一位置中（寬度維持一欄） */
.ye-lecture__teacher:last-child:nth-child(odd) {
  grid-column: 1 / -1; justify-self: center; width: calc((100% - var(--teacher-gap)) / 2);
  margin-top: 13px; /* PSD 第三排距離較大 */
}
/* 照片＋金屬框＋陰影為同一張圖（370×512），框本體 346×488，四周多 12px 陰影 */
.ye-lecture__photo { position: relative; aspect-ratio: 346 / 488; }
.ye-lecture__photo-img {
  position: absolute; left: -3.468%; top: -2.459%; width: 106.936%; height: 104.918%;
  display: block; max-width: none;
}
.ye-lecture__teacher-label {
  margin: 15px 0 0; font-family: var(--ye-pixel); font-size: 29.7px; line-height: 1;
  letter-spacing: .5em; margin-right: -.5em; color: #0c0d0e;
}
.ye-lecture__teacher-name {
  display: flex; align-items: baseline; justify-content: center; gap: 4px;
  margin: 12px 0 0; font-family: var(--ye-pixel); font-size: 24.4px; line-height: 1; color: #0c0d0e;
}
.ye-lecture__teacher-name strong { font-size: 42.8px; font-weight: 400; color: #fb720e; }

/* 講座場次：左圖 384×232（圖片未上傳時為黑色暫定區塊）＋右側文字 */
.ye-lecture__list {
  width: min(995px, calc(100% - 48px)); margin: 34px auto 0; padding: 0; list-style: none; text-align: left;
}
.ye-lecture__item {
  display: grid; grid-template-columns: 384px 1fr; column-gap: 31px; align-items: start;
  margin: 0 0 13px;
}
.ye-lecture__image {
  position: relative; aspect-ratio: 384 / 232; overflow: hidden;
  background: #2e2e2e; border: 7.6px solid #d5d4d6; outline: 0;
}
.ye-lecture__image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ye-lecture__school {
  margin: 26px 0 0; font-family: var(--ye-pixel); font-size: 41.6px; line-height: 1; font-weight: 400;
  letter-spacing: .5em; color: #fb720e;
}
.ye-lecture__detail { margin: 20px 0 0; font-family: var(--ye-pixel); font-size: 27px; line-height: 42px; color: #2e2e2e; }
.ye-lecture__detail > div { display: flex; }
.ye-lecture__detail dt, .ye-lecture__detail dd { margin: 0; font-weight: 400; }
.ye-lecture__detail dt { flex: none; }

/* 平板 */
@media (max-width: 1023px) {
  .ye-lecture { padding-top: 60px; }
  .ye-page-title--pixel { font-size: 68px; }
  .ye-page-title__en { font-size: 26px; }
  .ye-lecture__teachers { grid-template-columns: repeat(2, min(346px, calc((100% - 82px) / 2))); }
  .ye-lecture__teacher-label { font-size: 24px; }
  .ye-lecture__teacher-name { font-size: 20px; }
  .ye-lecture__teacher-name strong { font-size: 34px; }
  .ye-lecture__item { grid-template-columns: 44% 1fr; column-gap: 24px; }
  .ye-lecture__school { margin-top: 12px; font-size: 32px; letter-spacing: .3em; }
  .ye-lecture__detail { margin-top: 12px; font-size: 18px; line-height: 30px; } /* 地址一行放得下 */
}
/* 手機：講師 2 欄縮小；場次改成上圖下文 */
@media (max-width: 767px) {
  .ye-lecture { padding-top: 40px; padding-bottom: 60px; }
  .ye-page-title--pixel { font-size: 46px; }
  .ye-page-title__en { margin-top: 8px; font-size: 18px; }
  .ye-lecture__teachers { --teacher-gap: 12px; grid-template-columns: repeat(2, calc((100% - 40px) / 2)); row-gap: 20px; margin-top: 24px; }
  .ye-lecture__teacher-label { margin-top: 8px; font-size: 16px; }
  .ye-lecture__teacher-name { flex-wrap: wrap; margin-top: 6px; font-size: 13px; }
  .ye-lecture__teacher-name strong { font-size: 24px; }
  .ye-lecture__list { width: calc(100% - 28px); margin-top: 40px; }
  .ye-lecture__item { grid-template-columns: 1fr; margin-bottom: 30px; }
  .ye-lecture__image { border-width: 5px; }
  .ye-lecture__school { margin-top: 14px; font-size: 26px; }
  .ye-lecture__detail { margin-top: 8px; font-size: 17px; line-height: 28px; }
}