/* ============================================================
   home.css — 首頁專用
   2.5.0「球道」版（使用者選 C，不要 AI 感的白卡）：
     內容區浮在一條楓木球道上 —— 木板紋（repeating-linear-gradient）、七支箭頭標記、
     標題列＋球瓶、紅色犯規線；卡片白底但角、影、字型都往「球館現場」走。
   ⛔ 不動 style.css：navbar / footer / announcements 沿用 v2；本檔只管 .hm-* 與首頁 body 底色。
   ⛔ 所有 class 名沿用 2.2.0（hm-g / hm-hero / hm-org__item …），index.html 的 JS 綁定不變。
   ============================================================ */

/* 球道殼（木紋容器／箭頭／標題列／球瓶／犯規線／body 底色／navbar 琥珀鈕）住在 css/lane-theme.css —— 三頁共用；
   index.html 要先載 lane-theme.css 再載本檔。本檔只剩首頁的內容區。 */

/* ---- 內容區 grid（左窄欄：我的成績／英雄榜／球館；右寬欄：賽事） ---- */
.hm-main { display: grid; grid-template-columns: 20rem minmax(0,1fr); gap: 1.25rem; padding-block: 1.4rem 1.6rem; }
@media (max-width: 860px) { .hm-main { grid-template-columns: 1fr; } }
.hm-rail { display: flex; flex-direction: column; gap: 1.25rem; }

/* 卡片：浮在球道上 —— 影子帶木色、角圓一點、不再是「白卡＋淡陰影」 */
.hm-card { background: #fff; border: 0; border-radius: 14px; box-shadow: 0 12px 30px rgba(60,30,0,.28), 0 1px 0 rgba(255,255,255,.6) inset; overflow: hidden; }
.hm-card .hm-hd { display: flex; align-items: baseline; gap: .75rem; padding: .85rem 1rem .6rem; border-bottom: 1px solid #efe9dc; }
.hm-card .hm-hd h2 { margin: 0; font: 900 .95rem 'Noto Sans TC', sans-serif; letter-spacing: .06em; color: #14162b; }
.hm-hd__hint { font-size: .8rem; color: #8a7a5a; }
.hm-hd__more { margin-left: auto; font: 600 .72rem 'Chakra Petch', sans-serif; letter-spacing: .1em; color: #1a237e; text-decoration: none; white-space: nowrap; text-transform: uppercase; }
.hm-hd__more:hover { text-decoration: underline; }
.hm-num { font-family: 'Chakra Petch', monospace; font-variant-numeric: tabular-nums; }

/* ---- 賽事流 ---- */
.hm-grp { font: 600 .68rem 'Chakra Petch', sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #6b4e1a; padding: .7rem 1rem .15rem; }
.hm-g { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: .9rem; align-items: center; padding: .7rem 1rem; color: inherit; text-decoration: none; border-top: 1px solid #f1ece0; }
.hm-g:hover { background: #faf6ec; text-decoration: none; }
.hm-g__d { background: #14162b; color: #fff; border-radius: 8px; padding: .4rem .6rem; text-align: center; line-height: 1; min-width: 3.4rem; }
.hm-g__d b { display: block; font: 700 1.35rem 'Chakra Petch', sans-serif; }
.hm-g__d small { font-size: .62rem; letter-spacing: .06em; opacity: .8; }
.hm-g__n { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #14162b; }
.hm-g__m { font-size: .82rem; color: #6b6b7b; display: flex; gap: .6rem; flex-wrap: wrap; margin-top: .1rem; }
.hm-st { font: 600 .72rem 'Chakra Petch', sans-serif; letter-spacing: .06em; padding: .3rem .75rem; border-radius: 999px; white-space: nowrap; color: #6b4e1a; background: #f4f1ea; border: 0; }
.hm-st--live { background: #c8372d; color: #fff; display: inline-flex; gap: .4rem; align-items: center; }
.hm-dot { width: 6px; height: 6px; border-radius: 50%; background: #fff; }
@media (prefers-reduced-motion: no-preference) {
  .hm-dot { animation: hm-pulse 1.4s infinite; }
  @keyframes hm-pulse { 50% { opacity: .25; } }
}
.hm-empty { padding: 1.5rem 1rem; color: #6b6b7b; font-size: .9rem; }

/* ---- 我的成績 ---- */
.hm-me { padding: 0 0 .9rem; }
.hm-me .hm-hd { padding: .85rem 1rem .6rem; }
.hm-me #hm-me-body { padding: .8rem 1rem 0; }
.hm-stats { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.hm-stat { background: #f4f1ea; border-radius: 10px; padding: .55rem .7rem; }
.hm-stat small { font-size: .72rem; color: #6b4e1a; display: block; }
.hm-stat b { font: 700 1.7rem/1.1 'Chakra Petch', sans-serif; display: block; color: #1a237e; }
.hm-stat b em { font-style: normal; font-size: .72rem; color: #6b6b7b; font-weight: 400; margin-left: .25rem; }
.hm-rl { display: flex; justify-content: space-between; gap: .5rem; font-size: .85rem; padding: .5rem 0; border-top: 1px solid #f1ece0; color: inherit; text-decoration: none; }
.hm-rl:first-of-type { border-top: 0; margin-top: .4rem; }
.hm-rl:hover { color: #1a237e; text-decoration: none; }
.hm-rl__t { color: #6b6b7b; margin-right: .5rem; }
.hm-rl b { font: 700 1rem 'Chakra Petch', sans-serif; }
.hm-rl__rk { color: #6b6b7b; font-size: .75rem; }
.hm-guest p { margin: 0 0 .75rem; font-size: .9rem; color: #6b6b7b; }
.hm-guest p b { color: #14162b; }
.hm-guest__row { display: flex; gap: .5rem; flex-wrap: wrap; }
.hm-guest__row .btn--primary { background: #14162b; border-color: #14162b; color: #fff; }
.hm-guest__row .btn--primary:hover:not(:disabled) { background: #2a2f55; }

/* ---- 英雄榜 ---- */
.hm-hero { display: grid; grid-template-columns: 2.1rem minmax(0,1fr) auto; gap: .75rem; align-items: center; padding: .6rem 1rem; border-top: 1px solid #f1ece0; color: inherit; text-decoration: none; }
.hm-hero:first-of-type { border-top: 0; }
.hm-hero:hover { background: #faf6ec; text-decoration: none; }
.hm-hero__av { width: 2.1rem; height: 2.1rem; border-radius: 50%; background: #e9d3a3; border: 2px solid #fff; box-shadow: 0 0 0 1px #e3c890; object-fit: cover; }
.hm-hero__nm { font-weight: 700; font-size: .9rem; line-height: 1.25; overflow: hidden; color: #14162b; }
.hm-hero__nm small { display: block; font-weight: 400; color: #6b6b7b; font-size: .74rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hm-hero__sc { font: 700 1.3rem/1.05 'Chakra Petch', sans-serif; text-align: right; color: #14162b; }
.hm-hero__sc small { display: block; font: 400 .66rem/1.2 'Chakra Petch', sans-serif; letter-spacing: .04em; color: #6b4e1a; }

/* ---- 球館／主辦方 ---- */
.hm-orgs:empty { display: none; }
.hm-org__item { display: grid; grid-template-columns: 2.1rem minmax(0,1fr) auto; gap: .75rem; align-items: center; padding: .55rem 1rem; border-top: 1px solid #f1ece0; color: inherit; text-decoration: none; }
.hm-org__item:first-child { border-top: 0; }
.hm-org__item:hover { background: #faf6ec; text-decoration: none; }
.hm-org__av { width: 2.1rem; height: 2.1rem; border-radius: 8px; background: #e9d3a3; border: 1px solid #e3c890; object-fit: cover; }
.hm-org__nm { font-weight: 700; font-size: .9rem; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #14162b; }
.hm-org__nm small { display: block; font-weight: 400; color: #6b6b7b; font-size: .74rem; }
.hm-org__ar { color: #b9ad94; font-size: 1.1rem; }
.hm-org__foot { display: flex; gap: .9rem; align-items: center; justify-content: space-between; padding: .8rem 1rem .9rem; border-top: 1px solid #f1ece0; background: #faf6ec; }
.hm-org__foot p { margin: 0; font-size: .82rem; color: #6b4e1a; }
.hm-org__foot .btn--ghost { color: #14162b; border: 1px solid #e3c890; background: #fff; }