/* 橙光：活力橙 + 暖白，体育杂志风，球票卡片赛程 */
:root {
  --cg-o: #ff7a1a;
  --cg-o2: #ffa94d;
  --cg-red: #f03e3e;
  --cg-deep: #d9480f;
  --cg-ink: #2b1b10;
  --cg-sub: #6f5646;
  --cg-mute: #ab9483;
  --cg-cream: #fff4e6;
  --cg-bg: #fffaf4;
  --cg-line: #f6dfc8;
  --cg-shadow: 0 14px 34px rgba(217, 72, 15, .12);
  --cg-num: "DIN Alternate", "Bahnschrift", "Arial Black", "Impact", sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--cg-ink); font: 14px/1.6 "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif; background: var(--cg-bg) repeating-linear-gradient(-45deg, transparent 0 22px, rgba(255, 122, 26, .025) 22px 44px); overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; margin: 0; padding: 0; }
h1, h2, p, dl, dd { margin: 0; }
img { vertical-align: middle; }
button { font: inherit; cursor: pointer; }
[hidden] { display: none !important; }
.cg-hide { display: none !important; }
.cg-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.cg-wrap { width: 1240px; max-width: 100%; margin: 0 auto; padding: 0 16px; }
.cg-main { padding-top: 26px; padding-bottom: 40px; min-height: 60vh; }
.cg-rv { opacity: 0; transform: translateY(26px) rotate(-1deg); transition: opacity .5s, transform .5s cubic-bezier(.2, .9, .3, 1.2); }
.cg-rv.in { opacity: 1; transform: none; }

/* ---------- 头部 ---------- */
.cg-hd { position: sticky; top: 0; z-index: 60; background: #fff; }
.cg-hd-in { display: flex; align-items: center; gap: 34px; height: 72px; }
.cg-hd-stripe { height: 6px; background: repeating-linear-gradient(-60deg, var(--cg-o) 0 14px, var(--cg-o2) 14px 28px); background-size: 64px 6px; animation: cg-belt 1.4s linear infinite; }
@keyframes cg-belt { to { background-position: 64px 0; } }
.cg-scrolled .cg-hd { box-shadow: 0 8px 24px rgba(217, 72, 15, .12); }
.cg-brand { display: flex; align-items: center; gap: 10px; }
.cg-brand-ic { position: relative; width: 40px; height: 40px; border-radius: 50%; background: radial-gradient(circle at 30% 30%, #ffc078, var(--cg-o) 60%, var(--cg-deep)); box-shadow: 0 6px 14px rgba(255, 122, 26, .45); animation: cg-dribble 1.2s cubic-bezier(.5, 0, .5, 1) infinite alternate; }
.cg-brand-ic::before, .cg-brand-ic::after, .cg-brand-ic i { content: ""; position: absolute; border: 1.6px solid rgba(43, 27, 16, .55); border-radius: 50%; }
.cg-brand-ic::before { inset: -1px 12px; }
.cg-brand-ic::after { inset: 12px -1px; border-left-color: transparent; border-right-color: transparent; }
.cg-brand-ic i { left: 50%; top: 0; bottom: 0; border-radius: 0; border-width: 0 0 0 1.6px; }
@keyframes cg-dribble { from { transform: translateY(-3px) rotate(0); } to { transform: translateY(3px) rotate(40deg); } }
.cg-brand-t { font-size: 24px; font-weight: 900; font-style: italic; letter-spacing: 1px; }
.cg-brand em { font-style: italic; font-weight: 900; font-size: 11px; color: #fff; background: var(--cg-ink); padding: 1px 8px; transform: skewX(-12deg); }
.cg-nav { display: flex; gap: 6px; }
.cg-nav a { position: relative; padding: 10px 22px; font-size: 16px; font-weight: 800; color: var(--cg-sub); transform: skewX(-12deg); transition: .25s; overflow: hidden; }
.cg-nav a span { display: inline-block; transform: skewX(12deg); position: relative; }
.cg-nav a::before { content: ""; position: absolute; inset: 0; background: var(--cg-o); transform: translateY(101%); transition: transform .3s cubic-bezier(.2, .9, .3, 1); }
.cg-nav a:hover { color: #fff; }
.cg-nav a:hover::before, .cg-nav a.on::before { transform: none; }
.cg-nav a.on { color: #fff; }
.cg-hot { margin-left: auto; display: flex; align-items: center; gap: 8px; padding: 6px 16px 6px 6px; border-radius: 26px; background: var(--cg-cream); font-weight: 900; font-style: italic; color: var(--cg-deep); }
.cg-hot b { min-width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--cg-red); color: #fff; font-family: var(--cg-num); font-style: normal; font-size: 18px; animation: cg-thump 1.2s ease-in-out infinite; }
@keyframes cg-thump { 0%, 100% { box-shadow: 0 0 0 0 rgba(240, 62, 62, .5); } 60% { box-shadow: 0 0 0 10px rgba(240, 62, 62, 0); } }

/* ---------- 通用 ---------- */
.cg-btn { display: inline-flex; align-items: center; justify-content: center; height: 36px; padding: 0 18px; border: 2px solid var(--cg-ink); background: #fff; color: var(--cg-ink); font-weight: 900; font-size: 13px; transform: skewX(-10deg); transition: .2s; white-space: nowrap; box-shadow: 3px 3px 0 var(--cg-ink); }
.cg-btn:hover { transform: skewX(-10deg) translate(-2px, -2px); box-shadow: 5px 5px 0 var(--cg-ink); }
.cg-btn-fill { background: var(--cg-o); border-color: var(--cg-ink); color: #fff; }
.cg-btn-mute { border-color: var(--cg-line); color: var(--cg-mute); box-shadow: 3px 3px 0 var(--cg-line); }
.cg-btn-mute:hover { box-shadow: 5px 5px 0 var(--cg-line); }
.cg-btn-xl { height: 54px; padding: 0 36px; font-size: 17px; box-shadow: 5px 5px 0 var(--cg-ink); }
.cg-crest { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: #fff; border: 3px solid #fff; box-shadow: 0 4px 12px rgba(217, 72, 15, .2); }
.cg-crest img { width: 82%; height: 82%; object-fit: contain; }
.cg-crest-xl { width: 110px; height: 110px; border-width: 6px; box-shadow: 0 16px 36px rgba(217, 72, 15, .3); }
.cg-ini { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: linear-gradient(135deg, var(--cg-o2), var(--cg-o)); color: #fff; font-weight: 900; font-size: 17px; font-style: italic; }
.cg-crest-xl .cg-ini { font-size: 44px; }
.cg-pop { animation: cg-pop .7s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes cg-pop { 0% { transform: scale(1); } 40% { transform: scale(1.5) rotate(-8deg); color: var(--cg-red); } 100% { transform: scale(1); } }
.cg-crumb { color: var(--cg-sub); font-size: 13px; }
.cg-crumb a:hover { color: var(--cg-deep); }
.cg-crumb-d { margin-bottom: 14px; }
.cg-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.cg-chip { padding: 5px 16px; border: 2px solid var(--cg-line); background: #fff; font-weight: 800; color: var(--cg-sub); transform: skewX(-10deg); transition: .2s; }
.cg-chip:hover { border-color: var(--cg-o); color: var(--cg-deep); }
.cg-chip.on { background: var(--cg-ink); border-color: var(--cg-ink); color: var(--cg-o2); }

/* ---------- 首页焦点 ---------- */
.cg-hero { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; min-height: 400px; border-radius: 6px; background: #fff; box-shadow: var(--cg-shadow); overflow: hidden; }
.cg-hero-l { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: 40px 0 40px 48px; }
.cg-hero-tag { display: flex; align-items: center; gap: 10px; font-weight: 800; color: var(--cg-sub); }
.cg-hero-tag span { padding: 2px 12px; background: var(--cg-red); color: #fff; font-style: italic; transform: skewX(-12deg); animation: cg-flash 1.4s steps(2) infinite; }
@keyframes cg-flash { 50% { background: var(--cg-o); } }
.cg-hero-h { display: flex; flex-direction: column; font-size: 54px; line-height: 1.05; font-weight: 900; font-style: italic; letter-spacing: 1px; }
.cg-hero-h span { animation: cg-slide .7s cubic-bezier(.2, .9, .3, 1) both; }
.cg-hero-h span:last-child { animation-delay: .15s; color: var(--cg-deep); }
.cg-hero-h em { font-size: 26px; color: var(--cg-o); margin: 2px 0; -webkit-text-stroke: 0; animation: cg-slide .7s .08s cubic-bezier(.2, .9, .3, 1) both; }
@keyframes cg-slide { from { opacity: 0; transform: translateX(-60px); } }
.cg-hero-info { display: flex; gap: 0; }
.cg-hero-info > div { padding: 6px 22px; border-left: 3px solid var(--cg-o); }
.cg-hero-info > div:first-child { padding-left: 0; border-left: 0; }
.cg-hero-info small { display: block; font-size: 12px; color: var(--cg-mute); font-weight: 700; }
.cg-hero-info b { font-family: var(--cg-num); font-size: 30px; line-height: 1.2; letter-spacing: 1px; }
.cg-hero[data-cgst="1"] .cg-hero-info [data-cgf="st"] { color: var(--cg-red); }
.cg-hero-l .cg-btn-xl { align-self: flex-start; }
.cg-hero-r { position: relative; background-size: cover; background-position: center; clip-path: polygon(18% 0, 100% 0, 100% 100%, 0 100%); }
.cg-hero-r::before { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(255, 122, 26, .85), rgba(255, 169, 77, .45) 50%, rgba(255, 244, 230, .25)); mix-blend-mode: multiply; }
.cg-hero-r::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(-60deg, rgba(255, 255, 255, .12) 0 2px, transparent 2px 18px); }
.cg-hero-crest { position: absolute; z-index: 1; animation: cg-hover 3.4s ease-in-out infinite; }
.cg-hero-crest-a { left: 28%; top: 22%; }
.cg-hero-crest-b { right: 12%; bottom: 18%; animation-delay: -1.7s; }
@keyframes cg-hover { 50% { transform: translateY(-14px) rotate(4deg); } }

.cg-marquee { margin: 26px -16px 0; overflow: hidden; background: var(--cg-ink); transform: rotate(-1.2deg); }
.cg-marquee div { display: flex; width: max-content; animation: cg-run 26s linear infinite; }
.cg-marquee span { padding: 10px 26px; color: #fff; font-weight: 900; font-style: italic; font-size: 17px; white-space: nowrap; }
.cg-marquee span::after { content: "★"; margin-left: 52px; color: var(--cg-o); }
@keyframes cg-run { to { transform: translateX(-50%); } }

/* ---------- 栏目 + 球票 ---------- */
.cg-sec { margin-top: 40px; }
.cg-sec-hd { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 16px; border-bottom: 4px solid var(--cg-ink); padding-bottom: 8px; }
.cg-sec-hd h2 { font-size: 30px; font-weight: 900; font-style: italic; }
.cg-sec-hd h2 b { color: var(--cg-o); }
.cg-sec-hd h2 em { margin-left: 12px; font-size: 14px; color: var(--cg-mute); letter-spacing: 3px; }
.cg-more { font-weight: 900; font-style: italic; color: var(--cg-deep); transition: .2s; }
.cg-more:hover { letter-spacing: 1px; }
.cg-tickets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.cg-row { position: relative; display: grid; grid-template-columns: 92px 1fr; background: #fff; border-radius: 14px; box-shadow: 0 6px 18px rgba(217, 72, 15, .08); transition: transform .3s, box-shadow .3s, opacity .5s; }
.cg-row.in:hover { transform: translateY(-6px) rotate(-.6deg); box-shadow: var(--cg-shadow); }
.cg-stub { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 14px 6px; border-radius: 14px 0 0 14px; background: var(--cg-cream); border-right: 2px dashed var(--cg-line); }
.cg-stub::before, .cg-stub::after { content: ""; position: absolute; right: -11px; width: 20px; height: 20px; border-radius: 50%; background: var(--cg-bg); }
.cg-stub::before { top: -10px; }
.cg-stub::after { bottom: -10px; }
.cg-stub b { font-family: var(--cg-num); font-size: 24px; line-height: 1; color: var(--cg-deep); }
.cg-stub small { color: var(--cg-mute); font-weight: 700; }
.cg-stub span { margin-top: 6px; padding: 0 8px; border-radius: 8px; background: #fff; font-size: 11px; color: var(--cg-sub); font-weight: 700; }
.cg-row.is-live .cg-stub { background: linear-gradient(180deg, var(--cg-o), var(--cg-red)); }
.cg-row.is-live .cg-stub b, .cg-row.is-live .cg-stub small { color: #fff; }
.cg-row.is-live .cg-stub span { color: var(--cg-red); animation: cg-flash2 1s steps(2) infinite; }
@keyframes cg-flash2 { 50% { opacity: .5; } }
.cg-tk { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; min-width: 0; }
.cg-tk-lg { display: flex; justify-content: space-between; font-weight: 800; font-size: 12px; color: var(--cg-deep); }
.cg-tk-lg i { font-style: normal; color: var(--cg-mute); }
.cg-tk-vs { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 6px; text-align: center; }
.cg-tk-vs span { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.cg-tk-vs span b { max-width: 100%; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cg-tk-vs strong { font-family: var(--cg-num); font-size: 26px; font-style: italic; color: var(--cg-ink); }
.cg-row.is-live .cg-tk-vs strong { color: var(--cg-red); }
.cg-tk .cg-btn { align-self: stretch; transform: none; box-shadow: none; height: 32px; border-width: 2px; }
.cg-tk .cg-btn:hover { transform: none; box-shadow: none; background: var(--cg-ink); color: #fff; }
.cg-tk .cg-btn-fill:hover { background: var(--cg-deep); }
.cg-none { padding: 50px 0; text-align: center; color: var(--cg-mute); background: #fff; border-radius: 14px; }
.cg-none-ball { display: inline-block; width: 54px; height: 54px; margin-bottom: 10px; border-radius: 50%; background: radial-gradient(circle at 30% 30%, #ffc078, var(--cg-o) 60%, var(--cg-deep)); box-shadow: inset -6px -6px 0 rgba(0, 0, 0, .08); animation: cg-bounce .6s cubic-bezier(.5, 0, .5, 1) infinite alternate; }
@keyframes cg-bounce { from { transform: translateY(0) scale(1.08, .92); } to { transform: translateY(-26px) scale(1); } }
.cg-day { display: flex; align-items: center; gap: 12px; margin: 30px 0 14px; }
.cg-day span { padding: 4px 18px; background: var(--cg-ink); color: #fff; font-style: italic; font-weight: 900; transform: skewX(-12deg); }
.cg-day i { flex: 1; height: 3px; background: repeating-linear-gradient(90deg, var(--cg-o) 0 10px, transparent 10px 16px); }
.cg-pager { display: flex; justify-content: center; gap: 10px; margin-top: 34px; }
.cg-pager a, .cg-pager b { min-width: 44px; height: 44px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--cg-ink); background: #fff; font-weight: 900; font-style: italic; transform: skewX(-10deg); transition: .2s; }
.cg-pager a:hover { background: var(--cg-cream); }
.cg-pager b { background: var(--cg-o); color: #fff; }

/* ---------- 列表横幅 ---------- */
.cg-band { position: relative; overflow: hidden; border-radius: 6px; background-size: cover; background-position: center; box-shadow: var(--cg-shadow); }
.cg-band::before { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(255, 250, 244, .98) 0 45%, rgba(255, 169, 77, .7) 75%, rgba(255, 122, 26, .5)); }
.cg-band-in { position: relative; padding: 38px 44px; }
.cg-band h1 { margin: 6px 0; font-size: 46px; font-weight: 900; font-style: italic; }
.cg-band h1 em { margin-left: 14px; font-size: 16px; color: var(--cg-o); letter-spacing: 4px; }
.cg-band-n { font-weight: 700; color: var(--cg-sub); }
.cg-band-n b { font-family: var(--cg-num); font-size: 30px; color: var(--cg-deep); }

/* ---------- 详情 ---------- */
.cg-board { position: relative; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 30px; border-radius: 6px; background: linear-gradient(110deg, #fff 0 35%, var(--cg-cream) 35% 65%, #fff 65%); box-shadow: var(--cg-shadow); overflow: hidden; }
.cg-board::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 8px; background: repeating-linear-gradient(-60deg, var(--cg-o) 0 14px, var(--cg-ink) 14px 28px); background-size: 64px 8px; animation: cg-belt 1.4s linear infinite; }
.cg-board-side { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.cg-board-side b { font-size: 24px; font-weight: 900; font-style: italic; }
.cg-board-side small { font-weight: 900; letter-spacing: 3px; color: var(--cg-mute); }
.cg-board-mid { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0 40px; }
.cg-board-mid p { padding: 2px 14px; background: var(--cg-ink); color: var(--cg-o2); font-weight: 900; transform: skewX(-10deg); }
.cg-board-mid strong { font-family: var(--cg-num); font-size: 76px; line-height: 1.05; font-style: italic; }
.cg-board-st { font-weight: 900; color: var(--cg-sub); }
[data-cgst="1"] .cg-board-st { color: var(--cg-red); animation: cg-flash2 1s steps(2) infinite; }
.cg-board-mid time { color: var(--cg-mute); font-size: 13px; }
.cg-room { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 22px; margin-top: 22px; align-items: start; }
.cg-screen { padding: 18px; background: #fff; border-radius: 6px; box-shadow: var(--cg-shadow); }
.cg-screen h1 { margin-bottom: 12px; font-size: 19px; font-style: italic; }
.cg-video { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 4px; background: repeating-linear-gradient(-45deg, var(--cg-cream) 0 18px, #ffe8cc 18px 36px); background-size: 51px 51px; animation: cg-belt 2s linear infinite; }
.cg-video iframe, .cg-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.cg-video-tip { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--cg-num); font-size: 34px; font-style: italic; font-weight: 900; color: var(--cg-o); letter-spacing: 6px; animation: cg-flash2 1s infinite; }
.cg-lines { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 16px; }
.cg-lines-lb { font-weight: 900; font-style: italic; color: var(--cg-mute); letter-spacing: 2px; }
.cg-line { height: 38px; padding: 0 20px; display: inline-flex; align-items: center; border: 2px solid var(--cg-ink); background: #fff; font-weight: 900; transform: skewX(-10deg); transition: .2s; }
.cg-line:hover { background: var(--cg-cream); }
.cg-line.cur { background: var(--cg-o); color: #fff; box-shadow: 4px 4px 0 var(--cg-ink); }
.cg-line-ext { border-style: dashed; }
.cg-off { padding: 60px 20px; text-align: center; color: var(--cg-sub); background: var(--cg-cream); border-radius: 4px; font-weight: 700; }
.cg-off .cg-btn { margin-top: 16px; }
.cg-off-cd { margin-top: 10px; font-family: var(--cg-num); font-size: 40px; color: var(--cg-deep); font-style: italic; }
.cg-aside { display: grid; gap: 18px; position: sticky; top: 96px; }
.cg-card { padding: 20px; background: #fff; border-radius: 6px; box-shadow: var(--cg-shadow); border-top: 5px solid var(--cg-o); }
.cg-card h2 { margin-bottom: 12px; font-size: 18px; font-weight: 900; font-style: italic; letter-spacing: 1px; }
.cg-dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 14px; }
.cg-dl dt { color: var(--cg-mute); font-weight: 700; }
.cg-dl dd { text-align: right; font-weight: 800; }
.cg-list { counter-reset: n; }
.cg-list li { counter-increment: n; }
.cg-list a { display: grid; grid-template-columns: 26px 46px 1fr auto; align-items: center; gap: 6px; padding: 9px 4px; border-bottom: 1px dashed var(--cg-line); transition: .2s; }
.cg-list a::before { content: counter(n); width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; background: var(--cg-ink); color: #fff; font-size: 11px; font-weight: 900; transform: skewX(-10deg); }
.cg-list li:nth-child(-n+3) a::before { background: var(--cg-o); }
.cg-list a:hover { background: var(--cg-cream); }
.cg-list time { font-family: var(--cg-num); color: var(--cg-deep); }
.cg-list span { font-size: 13px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cg-list em { font-style: normal; color: var(--cg-mute); }
.cg-list i { font-style: normal; font-size: 11px; color: var(--cg-mute); }
.cg-list li[data-cgst="1"] i { color: var(--cg-red); font-weight: 900; }

/* ---------- 404 ---------- */
.cg-404 { padding: 70px 20px; text-align: center; background: #fff; box-shadow: var(--cg-shadow); }
.cg-404-n { display: flex; justify-content: center; align-items: center; gap: 10px; font-family: var(--cg-num); font-size: 120px; line-height: 1; font-style: italic; }
.cg-404-n .cg-none-ball { width: 100px; height: 100px; margin: 0; }
.cg-404 h1 { margin-top: 16px; font-size: 28px; font-style: italic; }
.cg-404 p { color: var(--cg-sub); }
.cg-404-go { display: flex; justify-content: center; gap: 16px; margin-top: 24px !important; }

/* ---------- 页脚 ---------- */
.cg-ft { margin-top: 40px; background: #fff; border-top: 4px solid var(--cg-ink); overflow: hidden; }
.cg-ft-big { white-space: nowrap; font-size: 80px; line-height: 1.1; font-weight: 900; font-style: italic; color: transparent; -webkit-text-stroke: 2px var(--cg-line); animation: cg-run 40s linear infinite; width: max-content; }
.cg-ft-in { padding-bottom: 26px; color: var(--cg-sub); font-size: 13px; }
.cg-ft-in p + p { margin-top: 6px; }
.cg-ft-nav a { margin-right: 24px; font-weight: 900; color: var(--cg-ink); }
.cg-ft-nav a:hover { color: var(--cg-o); }
.cg-side-top { position: fixed; right: 24px; bottom: 30px; z-index: 50; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border: 2px solid var(--cg-ink); background: var(--cg-o); color: #fff; font-size: 22px; font-weight: 900; box-shadow: 4px 4px 0 var(--cg-ink); opacity: 0; transform: translateY(20px); pointer-events: none; transition: .3s; }
.cg-scrolled .cg-side-top { opacity: 1; transform: none; pointer-events: auto; }
.cg-side-top:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--cg-ink); }

@media (max-width: 1100px) {
  .cg-tickets { grid-template-columns: repeat(2, 1fr); }
  .cg-hero { grid-template-columns: 1fr; }
  .cg-hero-r { height: 220px; clip-path: polygon(0 18%, 100% 0, 100% 100%, 0 100%); }
  .cg-room { grid-template-columns: 1fr; }
  .cg-aside { position: static; }
}
@media (max-width: 720px) {
  .cg-hd-in { gap: 10px; height: 60px; }
  .cg-brand em, .cg-hot span { display: none; }
  .cg-brand-t { font-size: 18px; }
  .cg-brand-ic { width: 30px; height: 30px; }
  .cg-nav a { padding: 8px 10px; font-size: 14px; }
  .cg-hot { padding: 4px; }
  .cg-hero-l { padding: 26px 20px; }
  .cg-hero-h { font-size: 36px; }
  .cg-hero-info b { font-size: 22px; }
  .cg-hero-info > div { padding: 4px 12px; }
  .cg-tickets { grid-template-columns: 1fr; }
  .cg-band h1 { font-size: 32px; }
  .cg-board { padding: 22px 8px; }
  .cg-board-mid { padding: 0 6px; }
  .cg-board-mid strong { font-size: 42px; }
  .cg-crest-xl { width: 66px; height: 66px; }
  .cg-crest-xl .cg-ini { font-size: 26px; }
  .cg-board-side b { font-size: 15px; }
  .cg-ft-big { font-size: 50px; }
}

/* 系统设置了“减少动态效果”时关闭动画 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
}

/* 比分列表（内置 score-row 等）配色 */
:root { --sc-accent: #ff7a1a; --sc-on: #fff; --sc-live: #f03e3e; --sc-radius: 14px; }

/* 背景图（原来写在模板 style 属性里） */
.bgi-arena { background-image: url(/static/cg-static/img/arena.jpg) !important; }
.bgi-dunk { background-image: url(/static/cg-static/img/dunk.jpg) !important; }
.bgi-hoop { background-image: url(/static/cg-static/img/hoop.jpg) !important; }
.bgi-kick { background-image: url(/static/cg-static/img/kick.jpg) !important; }

/* 手机端：头部站名和导航不折行（之前会被挤成竖排），放不下时导航横向滚动 */
@media (max-width: 480px) {
  .cg-hd-in { gap: 8px; flex-wrap: nowrap; }
  .cg-brand, .cg-brand-t { white-space: nowrap; flex: none; font-size: 16px; }
  .cg-nav { flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; flex-wrap: nowrap; }
  .cg-nav::-webkit-scrollbar { display: none; }
  .cg-nav a { flex: none; white-space: nowrap; padding-left: 8px; padding-right: 8px; font-size: 14px; }
  .cg-hot { flex: none; white-space: nowrap; font-size: 11px; }
}
@media (max-width: 400px) {
  .cg-hot { display: none; }
}

/* 手机端：长队名不截断，换行完整显示 */
@media (max-width: 480px) {
  .cg-tk-vs > span > b, .cg-tk-vs > span { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; line-height: 1.3; }
}
@media (max-width: 480px) {
  .cg-list li a span { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; line-height: 1.3; }
}

/* 热门比赛标记（后台设为热门或属于热门联赛），手机上只显示火苗 */
.cg-fire { display: inline-flex; align-items: center; gap: 1px; margin-left: 4px; padding: 0 6px 0 4px; border-radius: 9px; background: linear-gradient(90deg, #ff8a1f, #ff3b30); color: #fff; font: normal 700 11px/17px -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; letter-spacing: 0; vertical-align: middle; white-space: nowrap; text-transform: none; animation: cg-fire-glow 1.8s ease-in-out infinite; }
.cg-fire::before { content: "🔥"; font-size: 11px; line-height: 1; }
@keyframes cg-fire-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(255, 80, 30, .35); } 50% { box-shadow: 0 0 0 4px rgba(255, 80, 30, 0); } }
@media (max-width: 480px) {
  .cg-fire { padding: 0 3px; font-size: 0; gap: 0; margin-left: 2px; }
  .cg-fire::before { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .cg-fire { animation: none; } }

/* 热门比赛：火苗跳动；整行左侧一抹淡淡的火光缓慢明暗，叠在原有背景上，不改变原样式 */
.cg-fire::before { display: inline-block; transform-origin: 50% 85%; animation: cg-flicker 1.3s ease-in-out infinite; }
@keyframes cg-flicker {
  0%, 100% { transform: scale(1) rotate(-4deg); filter: brightness(1); }
  25% { transform: scale(1.1, 1.2) rotate(3deg); filter: brightness(1.2); }
  50% { transform: scale(.95, 1.04) rotate(-2deg); filter: brightness(.95); }
  75% { transform: scale(1.06, 1.14) rotate(4deg); filter: brightness(1.15); }
}
.cg-hotrow { animation: cg-ember 3.2s ease-in-out infinite; }
@keyframes cg-ember {
  0%, 100% { box-shadow: inset 3px 0 0 rgba(255, 98, 40, .7), inset 90px 0 70px -52px rgba(255, 140, 50, .16); }
  50% { box-shadow: inset 3px 0 0 rgba(255, 64, 30, .9), inset 130px 0 90px -60px rgba(255, 112, 40, .26); }
}
tr.cg-hotrow { animation: none; }
tr.cg-hotrow > td { animation: cg-ember-td 3.2s ease-in-out infinite; }
tr.cg-hotrow > td:first-child { box-shadow: inset 3px 0 0 rgba(255, 80, 30, .8); }
@keyframes cg-ember-td { 0%, 100% { background-color: rgba(255, 150, 60, .05); } 50% { background-color: rgba(255, 120, 40, .11); } }
@media (prefers-reduced-motion: reduce) {
  .cg-fire::before, .cg-hotrow, tr.cg-hotrow > td { animation: none; }
  .cg-hotrow { box-shadow: inset 3px 0 0 rgba(255, 98, 40, .7), inset 90px 0 70px -52px rgba(255, 140, 50, .16); }
}

/* 播放页球队名链接到球队搜索页 */
.cg-tlink { color: inherit; text-decoration: none; border-bottom: 1px dashed currentColor; }
.cg-tlink:hover { opacity: .8; border-bottom-style: solid; }

/* 首页：日期选择 + 热门直播 + 赛事直播 */
.cg-sec .hd-dates { margin: 0; }
.cg-sec-hd .hd-tabs { margin-bottom: 4px; }
.cg-tk-lg .hd-lg:hover { color: var(--cg-o); text-decoration: none; }
/* 导航 5 项：手机上导航单独一行，一屏放下 */
@media (max-width: 768px) {
  .cg-hd-in { flex-wrap: wrap; height: auto; row-gap: 6px; padding-top: 10px; padding-bottom: 8px; }
  .cg-nav { order: 3; flex: 1 0 100%; width: 100%; overflow: visible; gap: 2px; }
  .cg-nav a { flex: 1 0 auto; padding: 6px 4px; font-size: 14px; text-align: center; }
}
@media (max-width: 480px) {
  .cg-sec-hd { flex-wrap: wrap; gap: 8px; }
  .cg-sec-hd h2 { font-size: 24px; }
}

/* 热门标记：本模板专属样式（★ HOT），覆盖上面通用的 🔥 热门；手机上只显示图标 */
.cg-fire { --cg-hot-lb: 11px; gap: 2px; font-size: 0; background: #ff7a00; color: #fff; border: 0; border-radius: 2px; animation: cg-hot-glow 1.8s ease-in-out infinite; font-style: italic; transform: skewX(-12deg); letter-spacing: .5px; }
.cg-fire::before { content: "★"; display: inline-block; transform-origin: 50% 50%; animation: cg-hot-ic 4s linear infinite; }
.cg-fire::after { content: "HOT"; font-size: var(--cg-hot-lb); line-height: 1; }
@keyframes cg-hot-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(255,122,0, .35); } 50% { box-shadow: 0 0 0 4px rgba(255,122,0, 0); } }
@keyframes cg-hot-ic { from { transform: rotate(0); } to { transform: rotate(360deg); } }
@media (max-width: 480px) { .cg-fire { --cg-hot-lb: 0; gap: 0; } }
@media (prefers-reduced-motion: reduce) { .cg-fire, .cg-fire::before { animation: none; } }

/* 日期条吸顶（样式在内置 hd.css）：底色跟页面一致 */
:root { --hd-bg: var(--cg-bg); }
/* 整行可点（row-cover） */
.cg-row { cursor: pointer; }