/* 海碗杯 · 赛事门户。配色跟 MAN 品牌走：深炭底 + MAN 荧光黄绿 #cdee2c。
   字体：得意黑 Smiley Sans（中文标题）+ Anton（英文/数字），子集自托管；正文系统字体。 */
@font-face { font-family: "HW SC"; font-style: normal; font-weight: 100 900; src: url("fonts/display-sc.woff2?v=4") format("woff2"); font-display: swap; }
@font-face { font-family: "HW SC"; font-style: italic; font-weight: 100 900; src: url("fonts/display-sc.woff2?v=4") format("woff2"); font-display: swap; }
@font-face { font-family: "HW Cond"; font-style: normal; font-weight: 100 900; src: url("fonts/display-en.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "HW Cond"; font-style: italic; font-weight: 100 900; src: url("fonts/display-en.woff2") format("woff2"); font-display: swap; }

:root {
  --bg: #0b0d10;
  --bg-2: #0f1216;
  --panel: #151a20;
  --panel-2: #1b2129;
  --line: #242b34;
  --line-2: #344050;
  --text: #ffffff;
  --text-2: #d6d6dc;
  --muted: #8f8f99;
  --faint: #5f5f69;
  --red: #cdee2c;          /* 主色：MAN 荧光黄绿（沿用变量名，全站点睛色） */
  --red-2: #a9c41c;
  --red-glow: rgba(205, 238, 44, .45);
  --on-red: #0b0d10;        /* 主色上的文字 */
  --blue: #5b8cff;
  --gold: #f0c35a;
  --live: #cdee2c;
  --wrap: 1280px;
  --cond: "HW Cond", "Anton", "Impact", "Arial Narrow", "HW SC", sans-serif;
  --sc: "HW SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", Roboto, sans-serif;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 15px; line-height: 1.55; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p { margin: 0; }
button { font: inherit; color: inherit; }
.wrap { width: min(var(--wrap), 100% - 40px); margin-inline: auto; }
.skip { position: absolute; left: -999px; top: 8px; background: #fff; color: #000; padding: 8px 12px; z-index: 100; }
.skip:focus { left: 8px; }

/* ---------- 按钮 ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 18px; font-family: var(--cond), var(--sc); font-weight: 800; font-size: 15px; letter-spacing: .06em; text-transform: uppercase; border: 1px solid transparent; cursor: pointer; transition: background .15s, border-color .15s, transform .15s, box-shadow .2s; white-space: nowrap; border-radius: 2px; }
.btn svg { width: 14px; height: 14px; }
.btn-red { background: var(--red); color: var(--on-red); }
.btn-red:hover { background: #dbf74a; box-shadow: 0 8px 28px -8px var(--red-glow); }
.btn-white { background: #fff; color: #0b0b0d; }
.btn-white:hover { background: #e9e9ee; }
.btn-ghost { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.35); color: #fff; }
.btn-ghost:hover { border-color: #fff; background: rgba(255,255,255,.1); }
.btn-lg { height: 50px; padding: 0 28px; font-size: 18px; }
.btn-block { width: 100%; }
.btn[disabled] { opacity: .6; cursor: progress; }

/* ---------- 比分条 ---------- */
.ticker[hidden] { display: none; }
.ticker { display: flex; align-items: stretch; height: 64px; background: #050506; border-bottom: 1px solid var(--line); overflow: hidden; }
.ticker-track { flex: 1; display: flex; overflow-x: auto; scrollbar-width: none; }
.ticker-track::-webkit-scrollbar { display: none; }
.tk { flex: none; width: 168px; padding: 7px 14px 6px; align-content: center; border-right: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto auto; column-gap: 8px; font-size: 12px; }
.tk .st { grid-column: 1 / -1; font-size: 10px; line-height: 1.4; margin-bottom: 2px; color: var(--muted); letter-spacing: .06em; display: flex; justify-content: space-between; }
.tk .t { font-family: var(--cond); font-weight: 400; font-size: 14px; letter-spacing: .04em; color: var(--text-2); line-height: 1.3; }
.tk .s { font-family: var(--cond); font-weight: 400; font-size: 14px; color: var(--faint); text-align: right; line-height: 1.3; }
.ticker-all { flex: none; display: flex; align-items: center; gap: 6px; padding: 0 18px; font-size: 12px; color: #fff; border-left: 1px solid var(--line); background: var(--panel); white-space: nowrap; }
.ticker-all svg { width: 12px; height: 12px; }

/* ---------- 导航 ---------- */
.nav { position: sticky; top: 0; z-index: 60; background: rgba(11,11,13,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
.nav-in { display: flex; align-items: center; gap: 36px; height: 64px; width: min(var(--wrap), 100% - 40px); margin: 0 auto; }
.brand { display: flex; align-items: center; gap: 10px; flex: none; }
.brand-crest { width: 40px; height: 40px; }
.brand-text { display: flex; flex-direction: column; line-height: 1; }
.brand-text b { font-family: var(--sc); font-weight: 900;  font-size: 19px; letter-spacing: .02em; }
.brand-text small { font-family: var(--cond); font-size: 12px; letter-spacing: .14em; color: var(--text-2); margin-top: 3px; }
.brand-text small i { font-style: normal; background: var(--red); color: var(--on-red); padding: 0 4px; margin-left: 2px; }
.menu { display: flex; gap: 4px; height: 100%; }
.menu a { position: relative; display: flex; align-items: center; padding: 0 12px; font-size: 14px; font-weight: 600; color: var(--text-2); transition: color .15s; }
.menu a:hover, .menu a.on { color: #fff; }
.menu a.on::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 3px; background: var(--red); }
.nav-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.lang-btn { height: 40px; min-width: 52px; padding: 0 10px; border: 1px solid var(--line-2); border-radius: 2px; background: transparent; font-family: var(--cond); font-size: 15px; letter-spacing: .08em; cursor: pointer; transition: border-color .15s, color .15s; }
.lang-btn:hover { border-color: var(--red); color: var(--red); }
.drawer-lang { margin-top: 12px; align-self: flex-start; }
html[data-lang="en"] .menu a { font-size: 13px; padding: 0 10px; }
.icon-btn { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line-2); border-radius: 2px; transition: border-color .15s; }
.icon-btn:hover { border-color: #fff; }
.icon-btn img { filter: brightness(0) invert(1); opacity: .85; }
.burger { display: none; width: 40px; height: 40px; border: 1px solid var(--line-2); background: transparent; border-radius: 2px; cursor: pointer; flex-direction: column; justify-content: center; align-items: center; gap: 4px; }
.burger span { width: 16px; height: 2px; background: #fff; }
.drawer { display: none; flex-direction: column; border-top: 1px solid var(--line); padding: 6px 20px 16px; }
.drawer a { padding: 13px 0; border-bottom: 1px solid var(--line); font-weight: 600; }
.drawer a.red { color: var(--red); }
.drawer.open { display: flex; }

/* ---------- 赛季进度 ---------- */
.stages { display: grid; grid-template-columns: repeat(5, 1fr); background: #050506; border-bottom: 1px solid var(--line); }
.stg { position: relative; padding: 10px 8px 14px; text-align: center; border-right: 1px solid var(--line); }
.stg:last-child { border-right: 0; }
.stg small { display: block; font-family: var(--cond); font-weight: 400; font-size: 10px; letter-spacing: .14em; color: var(--muted); }
.stg b { display: block; font-size: 13px; font-weight: 700; color: var(--text-2); margin-top: 1px; }
.stg::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--line); }
.stg .node { position: absolute; left: 50%; bottom: -5px; width: 13px; height: 13px; margin-left: -6.5px; border-radius: 50%; border: 2px solid var(--line-2); background: #050506; z-index: 1; }
.stg.done::after { background: #fff; }
.stg.done .node { background: #fff; border-color: #fff; }
.stg.now { background: linear-gradient(180deg, rgba(205,238,44,.0), rgba(205,238,44,.18)); }
.stg.now::after { background: var(--red); }
.stg.now small { color: var(--red); }
.stg.now b { color: #fff; }
.stg.now .node { border-color: var(--red); background: var(--bg); box-shadow: 0 0 0 3px rgba(205,238,44,.25); }
.stg.now .node::after { content: ""; position: absolute; inset: 2px; border-radius: 50%; background: var(--red); }

/* ---------- 主视觉 ---------- */
.hero { position: relative; min-height: 560px; height: 72vh; max-height: 760px; overflow: hidden; isolation: isolate; border-bottom: 1px solid var(--line); background: #060608; }
.hero-art { position: absolute; inset: 0; z-index: -1; background-size: cover; background-position: center; }
.smoke { position: absolute; border-radius: 50%; filter: blur(70px); mix-blend-mode: screen; }
.s-red { width: 70vw; height: 70vw; max-width: 980px; max-height: 980px; left: -18%; top: -40%; background: radial-gradient(circle, rgba(205,238,44,.55), rgba(120,150,20,.22) 45%, transparent 70%); animation: drift 14s ease-in-out infinite alternate; }
.s-blue { width: 64vw; height: 64vw; max-width: 900px; max-height: 900px; right: -16%; top: -30%; background: radial-gradient(circle, rgba(70,120,255,.55), rgba(30,60,170,.25) 45%, transparent 70%); animation: drift 16s ease-in-out infinite alternate-reverse; }
.s-red2 { width: 40vw; height: 40vw; left: 30%; bottom: -45%; background: radial-gradient(circle, rgba(205,238,44,.25), transparent 65%); animation: drift 18s ease-in-out infinite alternate; }
.s-gold { width: 50vw; height: 50vw; right: -10%; top: -40%; background: radial-gradient(circle, rgba(240,195,90,.35), transparent 65%); }
@keyframes drift { to { transform: translate(4%, 6%) scale(1.08); } }
.court-lines { position: absolute; left: 50%; bottom: -10%; width: 160%; height: 70%; transform: translateX(-50%) perspective(700px) rotateX(62deg); transform-origin: 50% 100%;
  background:
    radial-gradient(ellipse 22% 38% at 50% 100%, transparent 98%, rgba(255,255,255,.18) 99%, transparent 100%),
    radial-gradient(ellipse 44% 80% at 50% 100%, transparent 99.2%, rgba(255,255,255,.14) 99.5%, transparent 100%),
    linear-gradient(90deg, transparent 41.5%, rgba(255,255,255,.14) 41.5% 41.7%, transparent 41.7% 58.3%, rgba(255,255,255,.14) 58.3% 58.5%, transparent 58.5%);
  mask-image: linear-gradient(to top, #000 10%, transparent 90%); -webkit-mask-image: linear-gradient(to top, #000 10%, transparent 90%); }
.scan { position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 1px, transparent 1px 3px), linear-gradient(90deg, rgba(6,6,8,.85) 0%, rgba(6,6,8,.35) 55%, rgba(6,6,8,.1) 100%), linear-gradient(0deg, rgba(6,6,8,.9), transparent 40%); }
@keyframes pulse { 70% { box-shadow: 0 0 0 8px rgba(53,208,127,0); } 100% { box-shadow: 0 0 0 0 rgba(53,208,127,0); } }

.hero-in { position: relative; height: 100%; display: flex; align-items: center; justify-content: center; gap: clamp(32px, 5vw, 80px); padding: 40px 0; }
.hero-mark { position: relative; flex: none; width: clamp(240px, 26vw, 380px); aspect-ratio: 1; }
.hero-mark::before { content: ""; position: absolute; inset: 6%; border-radius: 50%; background: radial-gradient(circle, rgba(205,238,44,.28), transparent 65%); filter: blur(24px); animation: breathe 3.6s ease-in-out infinite; }
.hero-mark img { position: relative; display: block; width: 100%; height: 100%; filter: drop-shadow(0 18px 40px rgba(0,0,0,.55)); animation: floaty 6s ease-in-out infinite; }
.hero-copy { display: flex; flex-direction: column; align-items: flex-start; }
.hero-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13px; color: var(--muted); letter-spacing: .04em; }
.hero-meta .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--live); animation: pulse 2s infinite; }
.hero-meta [data-status-text] { color: #fff; font-weight: 600; }
.hero-meta b { color: var(--faint); font-weight: 400; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(205,238,44,.6); } 70% { box-shadow: 0 0 0 8px rgba(205,238,44,0); } 100% { box-shadow: 0 0 0 0 rgba(205,238,44,0); } }
.hero-copy h1 { display: flex; flex-direction: column; margin-top: 10px; }
.h-cn { font-family: var(--sc); font-size: clamp(76px, 10vw, 150px); line-height: .95; }
.h-sub { margin-top: 12px; font-family: var(--sc); font-size: clamp(20px, 2vw, 28px); color: var(--red); line-height: 1; }
.h-sub em { font-style: normal; font-family: var(--cond); letter-spacing: .14em; color: var(--text-2); margin-left: 10px; }
.hero-cta { display: flex; gap: 12px; margin-top: 30px; }
.hero-mark, .hero-copy { animation: rise .8s cubic-bezier(.2,.7,.2,1) both; }
.hero-copy { animation-delay: .1s; }

/* ---------- 面板通用 ---------- */
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 4px; }

/* 倒计时行 */
.countdown-row { display: grid; grid-template-columns: 1.6fr 1fr; margin-top: 28px; }
.countdown { border-radius: 4px 0 0 4px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 36px 20px; background: linear-gradient(180deg, #1c1c21, #141417); }
.cd-label { font-family: var(--sc); font-weight: 900; font-size: 18px; letter-spacing: .1em; color: var(--text-2); }
.cd-grid { display: flex; margin-top: 14px; }
.cd-grid div { display: flex; flex-direction: column; align-items: center; padding: 0 30px; border-right: 1px solid var(--line-2); }
.cd-grid div:last-child { border-right: 0; }
.cd-grid.idle b { color: var(--line-2); }
.cd-grid b { font-family: var(--cond); font-weight: 400; font-size: clamp(54px, 6.5vw, 92px); line-height: 1; letter-spacing: .01em; font-variant-numeric: tabular-nums; min-width: 1.15em; text-align: center; }
.cd-grid span { margin-top: 6px; font-size: 12px; font-weight: 700; color: var(--muted); letter-spacing: .2em; }
.cd-note { margin-top: 16px; font-size: 13px; color: var(--muted); }
.now-stage { border-left: 0; border-radius: 0 4px 4px 0; padding: 26px; display: flex; flex-direction: column; gap: 12px; background: var(--bg-2); }
.ns-top { display: flex; align-items: center; justify-content: space-between; }
.pill-live { display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px; background: rgba(53,208,127,.12); border: 1px solid rgba(53,208,127,.35); color: var(--live); font-size: 12px; font-weight: 700; border-radius: 2px; }
.pill-live i { width: 6px; height: 6px; border-radius: 50%; background: var(--live); }
.pill-live.closed { background: rgba(205,238,44,.12); border-color: rgba(205,238,44,.4); color: #ff6670; }
.pill-live.closed i { background: #ff6670; }
.ns-date { font-size: 12px; color: var(--muted); font-weight: 600; }
.ns-name { font-family: var(--sc); font-weight: 900;  font-size: 34px; line-height: 1.1; }
.ns-desc { font-size: 14px; color: var(--muted); }
.ns-stats { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 4px 0 6px; }
.ns-stats div { padding: 12px 0; }
.ns-stats div + div { padding-left: 14px; border-left: 1px solid var(--line); }
.ns-stats small { display: block; font-size: 11px; color: var(--muted); }
.ns-stats b { font-family: var(--cond); font-weight: 400; font-size: 28px; line-height: 1.1; }

/* ---------- 章节标题 ---------- */
section.wrap { margin-top: 64px; }
.sec-title { display: flex; align-items: baseline; gap: 14px; margin-bottom: 20px; flex-wrap: wrap; }
.sec-title h2 { font-family: var(--sc); font-weight: 900;  font-size: clamp(28px, 3vw, 38px); line-height: 1; position: relative; padding-left: 16px; }
.sec-title h2::before { content: ""; position: absolute; left: 0; top: 4%; bottom: 4%; width: 6px; background: var(--red); transform: skewX(-12deg); }
.sec-en { font-family: var(--cond); font-weight: 400;  font-size: 18px; letter-spacing: .12em; color: var(--faint); }
.sec-note { margin-left: auto; font-size: 13px; color: var(--muted); }
.tag { padding: 2px 8px; border: 1px solid var(--red); color: var(--red); font-size: 12px; font-weight: 700; letter-spacing: .1em; align-self: center; }

/* 赛程条 */
.match-strip { display: flex; align-items: stretch; gap: 8px; }
.strip-nav { flex: none; width: 34px; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; cursor: pointer; display: grid; place-items: center; transition: border-color .15s; }
.strip-nav:hover { border-color: #fff; }
.strip-nav svg { width: 14px; height: 14px; }
.strip-track { flex: 1; display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.strip-track::-webkit-scrollbar { display: none; }
.day { flex: none; width: 54px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #e9e9ee; color: #0b0b0d; border-radius: 4px; scroll-snap-align: start; }
.day small { font-family: var(--cond); font-weight: 400; font-size: 12px; letter-spacing: .1em; }
.day b { font-family: var(--sc); font-weight: 900; font-size: 15px; line-height: 1.2; writing-mode: vertical-rl; letter-spacing: .1em; }
.mc { flex: none; width: 210px; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; padding: 10px 12px; scroll-snap-align: start; transition: border-color .15s; }
.mc:hover { border-color: var(--line-2); }
.mc-top { display: flex; justify-content: space-between; font-size: 11px; color: var(--muted); font-weight: 600; }
.mc-top b { color: #fff; font-family: var(--cond); font-weight: 400; letter-spacing: .06em; }
.mc-teams { margin-top: 8px; display: grid; gap: 4px; }
.mc-row { display: flex; align-items: center; gap: 8px; padding: 6px 8px; background: var(--bg-2); border-radius: 2px; }
.mc-row .logo { width: 20px; height: 20px; border-radius: 50%; background: var(--panel-2); border: 1px dashed var(--line-2); flex: none; overflow: hidden; }
.mc-row .logo.has { border: 0; border-radius: 3px; }
.mc-row .logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mc-row .nm { flex: 1; font-family: var(--cond); font-weight: 400; font-size: 15px; letter-spacing: .06em; color: var(--text-2); }
.mc-row .sc { font-family: var(--cond); font-weight: 400; font-size: 16px; color: var(--faint); }
.mc-row.win .nm, .mc-row.win .sc { color: #fff; }
.strip-bracket { flex: none; width: 110px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; font-weight: 800; font-size: 13px; transition: border-color .15s, background .15s; }
.strip-bracket:hover { border-color: var(--red); background: rgba(205,238,44,.1); }
.strip-bracket svg { width: 26px; height: 26px; }

/* 数据中心 */
.kpis { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid var(--line); border-radius: 4px; background: var(--panel); margin-bottom: 16px; }
.kpi { padding: 18px 20px; border-right: 1px solid var(--line); }
.kpi:last-child { border-right: 0; }
.kpi small { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; font-weight: 700; color: var(--text-2); }
.kpi small em { font-style: normal; font-family: var(--cond); letter-spacing: .12em; color: var(--faint); }
.kpi b { display: block; margin-top: 8px; font-family: var(--cond); font-weight: 400; font-size: 44px; line-height: 1; }
.kpi b.nil { color: var(--line-2); }
.stats-grid { display: grid; grid-template-columns: 1fr 1.35fr; gap: 16px; align-items: start; }
.standings-panel { padding: 20px 22px; }
.sp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.sp-head h3 { font-family: var(--sc); font-size: 22px; }
.tabs { display: flex; gap: 4px; padding: 3px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px; }
.tabs button { padding: 5px 12px; background: transparent; border: 0; border-radius: 2px; font-size: 12px; font-weight: 700; color: var(--muted); cursor: pointer; transition: background .15s, color .15s; }
.tabs button.on { background: var(--red); color: var(--on-red); }
.st-table tr.qual td:first-child { box-shadow: inset 3px 0 0 var(--red); }
.st-table td.pos { color: var(--red); }
.st-table td.neg { color: #ff6670; }
.st-table td.pts { font-family: var(--cond); font-size: 17px; color: #fff; }
.sp-note { margin-top: 12px; font-size: 12px; color: var(--faint); }
.leaders { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.leader { background: var(--panel); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.leader header { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 14px 10px; border-bottom: 1px solid var(--line); }
.leader header span { font-family: var(--sc); font-size: 18px; }
.leader header em { font-style: normal; font-family: var(--cond); font-size: 11px; letter-spacing: .14em; color: var(--faint); }
.ld-top { display: grid; grid-template-columns: 52px 1fr auto; gap: 10px; align-items: center; padding: 12px 14px; background: linear-gradient(90deg, rgba(205,238,44,.08), transparent 70%); }
.ld-photo { position: relative; width: 52px; height: 52px; border-radius: 50%; overflow: hidden; background: #1a2027; display: grid; place-items: end center; }
.ld-photo img { width: 100%; height: 100%; object-fit: cover; }
.ld-sil { width: 86%; fill: #2a333d; }
.ld-rank { position: absolute; right: -1px; bottom: -1px; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: var(--on-red); font-family: var(--cond); font-size: 11px; }
.ld-who { min-width: 0; display: flex; flex-direction: column; }
.ld-who b { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ld-who small { font-size: 11px; color: var(--muted); }
.leader.tbd .ld-who b { color: var(--muted); font-weight: 600; }
.ld-val { text-align: right; display: flex; flex-direction: column; }
.ld-val b { font-family: var(--cond); font-weight: 400; font-size: 30px; line-height: 1; color: var(--red); }
.leader.tbd .ld-val b { color: var(--line-2); }
.ld-val small { font-size: 10px; color: var(--faint); }
.ld-list { list-style: none; margin: 0; padding: 4px 14px 10px; }
.ld-list li { display: grid; grid-template-columns: 18px 1fr auto; gap: 8px; align-items: baseline; padding: 6px 0; border-top: 1px solid var(--line); font-size: 13px; }
.ld-list li:first-child { border-top: 0; }
.ld-list .n { font-family: var(--cond); color: var(--faint); }
.ld-list .p { color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ld-list .p small { margin-left: 6px; color: var(--faint); font-size: 11px; }
.ld-list b { font-family: var(--cond); font-weight: 400; color: var(--muted); }
.leader.tbd .ld-list .p, .leader.tbd .ld-list b { color: var(--line-2); }

/* 个人奖项 */
.awards { display: grid; grid-template-columns: repeat(12, 1fr); gap: 12px; }
.award { grid-column: span 3; display: flex; flex-direction: column; gap: 16px; padding: 18px; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; position: relative; overflow: hidden; }
.award.feat { grid-column: span 6; flex-direction: row; padding: 24px; background: radial-gradient(ellipse at 0% 0%, rgba(205,238,44,.14), transparent 55%), var(--panel); border-color: rgba(205,238,44,.35); }
.aw-medal { position: relative; flex: none; width: 74px; height: 74px; }
.award.feat .aw-medal { width: 104px; height: 104px; }
.aw-medal svg { width: 100%; height: 100%; filter: drop-shadow(0 8px 18px rgba(0,0,0,.5)); }
.aw-medal b { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--cond); font-weight: 400; font-size: 17px; letter-spacing: .04em; color: #fff; }
.award.feat .aw-medal b { font-size: 24px; color: var(--red); }
.aw-body { min-width: 0; display: flex; flex-direction: column; }
.aw-body small { font-family: var(--cond); font-size: 12px; letter-spacing: .14em; color: var(--faint); }
.aw-body h4 { margin: 2px 0 4px; font-family: var(--sc); font-weight: 400; font-size: 22px; }
.award.feat .aw-body h4 { font-size: 30px; }
.aw-body p { font-size: 13px; color: var(--muted); }
.aw-winner { margin-top: auto; padding-top: 12px; display: flex; align-items: baseline; gap: 8px; }
.aw-winner span { font-size: 15px; font-weight: 700; }
.award.tbd .aw-winner span { color: var(--faint); font-weight: 600; letter-spacing: .1em; }
.aw-winner em { font-style: normal; font-size: 12px; color: var(--muted); }
.aw-prize { margin-top: 6px; display: inline-block; align-self: flex-start; padding: 2px 8px; border: 1px solid rgba(205,238,44,.4); color: var(--red); font-size: 11px; font-weight: 700; }
.all-team { margin-top: 12px; padding: 20px 22px; }
.at-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.at-head h3 { font-family: var(--sc); font-size: 22px; }
.at-head span { font-family: var(--cond); font-size: 13px; letter-spacing: .16em; color: var(--red); }
.at-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.at-slot { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 14px 10px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 4px; }
.at-photo { width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: #1a2027; display: grid; place-items: end center; margin-bottom: 10px; border: 2px solid rgba(205,238,44,.3); }
.at-photo img { width: 100%; height: 100%; object-fit: cover; }
.at-slot b { font-size: 14px; }
.at-slot.tbd b { color: var(--faint); letter-spacing: .1em; }
.at-slot small { font-size: 12px; color: var(--muted); }
.award:hover, .leader:hover, .at-slot:hover { transform: translateY(-3px); border-color: rgba(205,238,44,.45); }
.award, .leader, .at-slot, .kpi { transition: transform .25s cubic-bezier(.2,.7,.2,1), border-color .2s; }
.award.feat .aw-medal svg { animation: medal-spin 14s linear infinite; }
@keyframes medal-spin { to { transform: rotate(360deg); } }

/* 直播间 */
.live-state { display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px; border: 1px solid var(--line-2); border-radius: 2px; font-size: 12px; font-weight: 700; color: var(--muted); }
.live-state i { width: 7px; height: 7px; border-radius: 50%; background: var(--faint); }
.live-state.live { color: #ff5a5f; border-color: rgba(255,90,95,.45); background: rgba(255,90,95,.08); }
.live-state.live i { background: #ff5a5f; animation: pulse 1.6s infinite; }
.live-state.upcoming { color: var(--red); border-color: rgba(205,238,44,.4); }
.live-state.upcoming i { background: var(--red); }
.ch { display: flex; align-items: center; gap: 12px; padding: 12px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px; transition: border-color .15s; }
a.ch:hover { border-color: var(--red); }
.ch-ic { width: 36px; height: 36px; flex: none; display: grid; place-items: center; border-radius: 3px; background: var(--panel-2); font-family: var(--cond); font-size: 18px; color: var(--text-2); }
.ch-name { flex: 1; display: flex; flex-direction: column; line-height: 1.25; }
.ch-name b { font-size: 14px; }
.ch-name small { font-size: 12px; color: var(--muted); }
.ch-go { font-size: 12px; font-weight: 700; color: var(--red); }
.ch.tbd .ch-go { color: var(--faint); font-weight: 400; }
/* 解说席 */
.casters-title { margin-top: 40px; }
.casters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.caster { display: block; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; transition: border-color .15s, transform .15s; }
a.caster:hover { border-color: var(--red); transform: translateY(-2px); }
.cs-photo { position: relative; aspect-ratio: 4 / 4.2; background: radial-gradient(ellipse at 50% 30%, #1d242c, #0c0f13 70%); display: grid; place-items: end center; overflow: hidden; }
.cs-photo img { width: 100%; height: 100%; object-fit: cover; }
.cs-sil { width: 74%; height: auto; fill: #232b34; }
.caster.tbd .cs-photo::after { content: "?"; position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%); font-family: var(--cond); font-size: 54px; color: rgba(205,238,44,.55); }
.cs-mic { position: absolute; right: 12px; bottom: 12px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--red); color: var(--on-red); }
.cs-mic svg { width: 18px; height: 18px; }
.cs-body { padding: 14px 16px 18px; border-top: 2px solid var(--red); display: flex; flex-direction: column; gap: 3px; }
.cs-body small { display: flex; justify-content: space-between; font-size: 12px; font-weight: 700; color: var(--red); letter-spacing: .1em; }
.cs-body small em { font-style: normal; font-family: var(--cond); color: var(--faint); letter-spacing: .12em; }
.cs-body b { font-family: var(--sc); font-size: 22px; line-height: 1.2; }
.caster.tbd .cs-body b { color: var(--muted); }
.cs-body span { font-size: 13px; color: var(--muted); }

.more { display: flex; justify-content: center; margin-top: 64px; position: relative; }
.more::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--line); }
.more span { position: relative; padding: 8px 28px; background: var(--bg); border: 1px solid var(--line); font-size: 12px; font-weight: 700; color: var(--red); letter-spacing: .2em; clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%); }

/* 想参赛 + 战队 */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.cta-card { position: relative; overflow: hidden; padding: 28px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; text-align: center; min-height: 380px; background: radial-gradient(ellipse at 50% 20%, rgba(205,238,44,.22), transparent 60%), linear-gradient(180deg, #161c12, #12161b 70%); border-color: rgba(205,238,44,.35); }
.cta-art { position: absolute; inset: 0 0 auto 0; height: 66%; display: grid; place-items: center; }
.cta-art .cta-badge { width: 190px; height: 190px; position: relative; z-index: 1; filter: drop-shadow(0 16px 40px rgba(0,0,0,.6)); animation: floaty 6s ease-in-out infinite; }
.badge-t1 { font-family: var(--cond); font-size: 22px; letter-spacing: 7px; fill: #fff; }
.badge-t2 { font-family: var(--cond); font-size: 14px; letter-spacing: 5px; fill: #cdee2c; }
.cta-rays { position: absolute; inset: -40%; background: repeating-conic-gradient(from 0deg at 50% 50%, rgba(255,255,255,.05) 0 4deg, transparent 4deg 14deg); animation: spin 60s linear infinite; mask-image: radial-gradient(circle, #000 10%, transparent 55%); -webkit-mask-image: radial-gradient(circle, #000 10%, transparent 55%); }
@keyframes spin { to { transform: rotate(360deg); } }
.cta-card h3 { position: relative; font-family: var(--sc); font-weight: 900;  font-size: 30px; }
.cta-card p { position: relative; margin: 6px 0 18px; color: var(--muted); font-size: 14px; }
.cta-card .btn { position: relative; max-width: 360px; }
.table-card { padding: 22px 24px; display: flex; flex-direction: column; }
.tc-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 10px; }
.tc-head h3 { font-family: var(--sc); font-weight: 900;  font-size: 22px; }
.tc-count { font-size: 13px; color: var(--muted); }
.tc-count b { font-family: var(--cond); font-weight: 400; font-size: 20px; color: #fff; }
.standings { width: 100%; border-collapse: collapse; font-size: 14px; }
.standings th { text-align: left; font-size: 11px; font-weight: 700; color: var(--muted); letter-spacing: .1em; padding: 8px 6px; border-bottom: 1px solid var(--line-2); }
.standings td { padding: 11px 6px; border-bottom: 1px solid var(--line); }
.standings .r { text-align: right; }
.standings .rk { width: 34px; font-family: var(--cond); font-weight: 400; font-size: 17px; color: var(--faint); }
.standings .tm { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.standings .tm i { width: 24px; height: 24px; border-radius: 50%; flex: none; background: var(--panel-2); border: 1px dashed var(--line-2); }
.standings .empty td { color: var(--faint); }
.standings .empty .tm { font-weight: 400; font-style: italic; }
.st-ok { color: var(--live); font-size: 12px; font-weight: 700; }
.st-wait { color: var(--muted); font-size: 12px; }
.tc-more { margin-top: auto; padding-top: 14px; display: inline-flex; align-items: center; gap: 6px; align-self: flex-end; font-size: 13px; color: var(--muted); }
.tc-more svg { width: 12px; height: 12px; }

/* 赛制 */
.facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); }
.fact { padding: 24px 22px; border-right: 1px solid var(--line); }
.fact:last-child { border-right: 0; }
.fact .lb { display: flex; justify-content: space-between; font-size: 13px; font-weight: 700; color: var(--text-2); }
.fact .lb small { font-family: var(--cond); font-weight: 400; letter-spacing: .14em; color: var(--faint); font-size: 12px; }
.fact .v { font-family: var(--cond); font-weight: 400;  font-size: 64px; line-height: 1; margin: 14px 0 8px; }
.fact .v.cn { font-family: var(--sc); font-weight: 900;  font-size: 46px; line-height: 1.15; }
.fact p { font-size: 13px; color: var(--muted); }
.stage-list { list-style: none; padding: 0; margin: 16px 0 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.stage-list li { position: relative; padding: 16px 16px 18px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.stage-list li::before { content: attr(data-n); position: absolute; right: 8px; top: -6px; font-family: var(--cond); font-weight: 400;  font-size: 64px; color: rgba(255,255,255,.04); line-height: 1; }
.stage-list small { font-family: var(--cond); font-weight: 400; font-size: 12px; letter-spacing: .12em; color: var(--faint); }
.stage-list b { display: block; font-family: var(--sc); font-weight: 900;  font-size: 20px; margin: 2px 0 6px; }
.stage-list p { font-size: 12.5px; color: var(--muted); }
.stage-list .dt { margin-top: 10px; font-size: 12px; font-weight: 700; color: var(--text-2); }
.stage-list li.now { border-color: var(--red); background: linear-gradient(180deg, rgba(205,238,44,.16), var(--bg-2) 70%); }
.stage-list li.now small, .stage-list li.now .dt { color: var(--red); }

/* 奖金 */
.prize-band { position: relative; overflow: hidden; margin-top: 80px; padding: 64px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #08080a; isolation: isolate; }
.prize-art { position: absolute; inset: 0; z-index: -1; }
.prize-art::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(115deg, transparent 0 22px, rgba(255,255,255,.02) 22px 24px); }
.prize-in { display: grid; grid-template-columns: 1fr 1.6fr; gap: 40px; align-items: center; }
.pp-label { font-family: var(--sc); font-weight: 900;  font-size: 28px; margin-top: 6px; }
.pp-value { font-family: var(--sc); font-weight: 900;  font-size: clamp(56px, 7vw, 96px); line-height: 1.05; background: linear-gradient(180deg, #fff3cf, var(--gold) 55%, #b98a26); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pp-value.num { font-family: var(--cond); }
.pp-note { margin-top: 6px; font-size: 13px; color: var(--muted); }
.podium { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.pd { position: relative; padding: 20px 16px; background: rgba(23,23,27,.85); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.pd::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 3px; background: var(--line-2); }
.pd.p1::before { background: var(--gold); } .pd.p2::before { background: #cfd3da; } .pd.p3::before { background: #c7864a; } .pd.p4::before { background: var(--red); }
.pd .rk { font-family: var(--cond); font-weight: 400;  font-size: 44px; line-height: 1; color: rgba(255,255,255,.9); }
.pd.p1 .rk { color: var(--gold); }
.pd small { display: block; margin-top: 6px; font-family: var(--cond); font-weight: 400; letter-spacing: .12em; font-size: 12px; color: var(--faint); }
.pd b { display: block; font-family: var(--sc); font-weight: 900; font-size: 18px; margin-top: 2px; }
.pd .val { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }

/* 报名 */
.signup { display: grid; grid-template-columns: 340px 1fr; gap: 20px; align-items: start; }
.signup-info { padding: 24px; position: sticky; top: 90px; }
.signup-info h3 { font-family: var(--sc); font-weight: 900;  font-size: 22px; margin-bottom: 8px; }
.steps { list-style: none; padding: 0; margin: 0; }
.steps li { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.steps li > b { font-family: var(--cond); font-weight: 400;  font-size: 26px; color: var(--red); line-height: 1; width: 30px; }
.steps strong { display: block; font-size: 14px; }
.steps span { display: block; font-size: 13px; color: var(--muted); margin-top: 2px; }
.help { margin-top: 16px; font-size: 13px; color: var(--muted); display: flex; gap: 8px; flex-wrap: wrap; }
.help a { color: #fff; font-weight: 600; border-bottom: 1px solid var(--red); }
.form { padding: 8px 28px 28px; }
.form fieldset { border: 0; margin: 0; padding: 22px 0; border-bottom: 1px solid var(--line); }
.form legend { padding: 0; margin-bottom: 14px; font-family: var(--sc); font-weight: 900;  font-size: 18px; }
.form legend small { font-family: var(--sans); font-style: normal; font-weight: 400; font-size: 12px; color: var(--muted); margin-left: 8px; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.grid2 .span2 { grid-column: 1 / -1; }
.logo-up { display: flex; gap: 16px; align-items: center; padding: 12px; border: 1px dashed var(--line-2); border-radius: 4px; background: var(--bg); transition: border-color .15s, background .15s; }
.logo-up.drag { border-color: var(--red); background: rgba(205,238,44,.05); }
.logo-up[aria-invalid="true"] { border-color: #ff4d58; }
.logo-prev { flex: none; width: 96px; height: 96px; border-radius: 6px; display: grid; place-items: center; align-content: center; gap: 4px; color: var(--faint); overflow: hidden;
  background: repeating-conic-gradient(#1a2028 0 25%, #12171d 0 50%) 0 0 / 16px 16px; border: 1px solid var(--line-2); }
.logo-prev svg { width: 28px; height: 28px; }
.logo-prev small { font-size: 11px; }
.logo-prev img { width: 100%; height: 100%; object-fit: contain; display: block; }
.logo-info { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.logo-btns { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.logo-pick { position: relative; height: 36px; font-size: 14px; cursor: pointer; }
.logo-pick input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.logo-fit { display: flex; gap: 3px; padding: 3px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px; }
.logo-fit button { padding: 5px 10px; border: 0; background: transparent; border-radius: 2px; font-size: 12px; font-weight: 700; color: var(--muted); cursor: pointer; }
.logo-fit button.on { background: var(--red); color: var(--on-red); }
.logo-spec { margin: 0; font-size: 12px; color: var(--muted); font-weight: 400; }
.logo-msg { margin: 0; font-size: 12px; font-weight: 600; min-height: 1em; }
.logo-msg.ok { color: var(--red); } .logo-msg.err { color: #ff6670; }
.rg { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.rg b { font-family: var(--cond); font-weight: 400; font-size: 12px; letter-spacing: .06em; padding: 1px 5px; border: 1px solid var(--line-2); border-radius: 2px; color: var(--text-2); }
.standings .tm img { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; background: #10141a; flex: none; }
.field { display: flex; flex-direction: column; gap: 6px; font-size: 12px; font-weight: 600; color: var(--text-2); }
.field i { color: var(--red); font-style: normal; }
.field input, .field select, .field textarea, .roster input, .roster select { width: 100%; height: 42px; padding: 0 12px; background: var(--bg); border: 1px solid var(--line-2); border-radius: 2px; color: #fff; font: inherit; font-size: 14px; transition: border-color .15s, box-shadow .15s; }
.field textarea { height: auto; padding: 10px 12px; resize: vertical; }
.field select, .roster select { appearance: none; -webkit-appearance: none; background: var(--bg) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6 9l6 6 6-6' fill='none' stroke='%238f8f99' stroke-width='2'/></svg>") right 10px center/14px no-repeat; padding-right: 30px; }
.field input:focus, .field select:focus, .field textarea:focus, .roster input:focus, .roster select:focus { outline: none; border-color: var(--red); box-shadow: 0 0 0 3px rgba(205,238,44,.2); }
input::placeholder, textarea::placeholder { color: var(--faint); }
[aria-invalid="true"] { border-color: #ff4d58 !important; }
.roster { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
.player { display: grid; grid-template-columns: 36px 1fr; gap: 10px; align-items: center; }
.player .num { height: 42px; display: grid; place-items: center; background: var(--panel-2); border-radius: 2px; font-family: var(--cond); font-weight: 400;  font-size: 18px; color: var(--muted); }
.player .num.cap { background: var(--red); color: var(--on-red); }
.check { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; font-size: 13px; color: var(--text-2); }
.check input { margin-top: 3px; accent-color: var(--red); }
.check a { color: #fff; border-bottom: 1px solid var(--red); }
.hp { position: absolute; left: -9999px; }
.form-foot { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 22px; flex-wrap: wrap; }
.form-msg { flex: 1; min-width: 200px; font-size: 13px; color: var(--muted); }
.form-msg.err { color: #ff6670; }
.form.done > *:not(.form-done) { display: none; }
.form-done { text-align: center; padding: 50px 10px; }
.form-done h3 { font-family: var(--sc); font-weight: 900;  font-size: 34px; }
.form-done p { margin-top: 8px; color: var(--muted); }

/* 对阵 */
.bracket-panel { padding: 24px; overflow-x: auto; }
.bracket { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 36px; }
.round { display: flex; flex-direction: column; }
.round h4 { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 10px; margin-bottom: 14px; border-bottom: 2px solid var(--line-2); font-family: var(--sc); font-weight: 900;  font-size: 16px; }
.round h4 small { font-family: var(--cond); font-weight: 400; font-style: normal; font-size: 12px; letter-spacing: .1em; color: var(--muted); }
.round .ms { display: flex; flex-direction: column; justify-content: space-around; gap: 12px; flex: 1; }
.bm { position: relative; background: var(--bg-2); border: 1px solid var(--line); border-radius: 2px; }
.bm::after { content: ""; position: absolute; right: -19px; top: 50%; width: 18px; height: 1px; background: var(--line-2); }
.round:last-child .bm::after { display: none; }
.bm .t { display: flex; align-items: center; gap: 8px; padding: 9px 12px; }
.bm .t + .t { border-top: 1px solid var(--line); }
.bm .t i { width: 18px; height: 18px; border-radius: 50%; background: var(--panel-2); border: 1px dashed var(--line-2); flex: none; }
.bm .t span { flex: 1; font-family: var(--cond); font-weight: 400; font-size: 15px; letter-spacing: .06em; color: var(--muted); }
.bm .t b { font-family: var(--cond); font-weight: 400; font-size: 17px; color: var(--faint); }
.bm .t.win span, .bm .t.win b { color: #fff; }
.bm .t.win { box-shadow: inset 3px 0 0 var(--red); }
.round:last-child .bm { border-color: rgba(205,238,44,.45); }

/* 规则 */
.rules { list-style: none; padding: 0; margin: 0; counter-reset: r; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rules li { counter-increment: r; display: flex; gap: 16px; padding: 18px 20px; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; font-size: 14px; color: var(--text-2); }
.rules li::before { content: counter(r, decimal-leading-zero); flex: none; font-family: var(--cond); font-weight: 400;  font-size: 26px; line-height: 1; color: var(--red); width: 30px; }

/* 公告 */

/* 联合冠名：首屏下方一条 */
.partners { padding: 22px 0; background: #07090b; border-bottom: 1px solid var(--line); }
.partners-in { display: flex; align-items: center; justify-content: center; gap: 36px; }
.partners-title { font-size: 12px; font-weight: 700; letter-spacing: .3em; color: var(--muted); }
.partner-row { display: flex; align-items: center; gap: 36px; }
.pt-x { font-family: var(--cond); font-size: 22px; color: var(--faint); }
.pt { display: flex; align-items: center; opacity: .92; transition: opacity .15s; }
.pt:hover { opacity: 1; }
.pt img { height: 34px; width: auto; display: block; }
.pt .hs { display: inline-flex; align-items: center; gap: 9px; font-family: var(--sc); font-size: 30px; line-height: 1; color: #fff; }
.pt .hs svg { width: 28px; height: 28px; color: var(--red); }

/* 页脚（2K 式） */
.foot { padding: 40px 0 30px; background: #000; border-top: 1px solid var(--line); }
.foot-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 26px; border-bottom: 1px solid var(--line); }
.foot-brand { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.foot-cup { width: 52px; height: 52px; }
.foot-x { color: var(--faint); font-size: 18px; }
.foot-brand b { display: block; font-family: var(--sc); font-weight: 900;  font-size: 18px; }
.foot-brand span { font-family: var(--cond); font-weight: 400; font-size: 13px; letter-spacing: .1em; color: var(--muted); }
.foot-social { display: flex; gap: 10px; }
.foot-social a { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line-2); border-radius: 50%; }
.foot-social img { filter: brightness(0) invert(1); opacity: .85; }
.foot-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding: 26px 0; border-bottom: 1px solid var(--line); }
.foot-cols h4 { font-family: var(--sc); font-weight: 900; font-size: 14px; margin-bottom: 10px; }
.foot-cols a { display: block; padding: 4px 0; font-size: 13px; color: var(--muted); }
.foot-cols a::before { content: "— "; color: var(--red); }
.foot-cols a:hover { color: #fff; }
.legal { margin-top: 20px; font-size: 12px; color: var(--faint); font-style: italic; line-height: 1.7; }

/* 弹层 */
.modal { position: fixed; inset: 0; z-index: 90; background: rgba(0,0,0,.72); display: grid; place-items: center; padding: 16px; }
.modal[hidden] { display: none; }
.modal-card { width: min(560px, 100%); background: var(--panel); border: 1px solid var(--line-2); border-top: 3px solid var(--red); padding: 26px; border-radius: 4px; }
.modal-card h3 { font-family: var(--sc); font-weight: 900;  font-size: 24px; }
.modal-card p { margin: 8px 0 14px; color: var(--muted); font-size: 14px; }
.modal-card textarea { width: 100%; padding: 12px; background: var(--bg); border: 1px solid var(--line-2); color: #fff; border-radius: 2px; font-family: ui-monospace, "SF Mono", Consolas, monospace; font-size: 13px; line-height: 1.6; }
.modal-actions { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }

/* 入场 */
@keyframes rise { from { opacity: 0; transform: translateY(18px); } }


/* ---------- 响应式 ---------- */
@media (max-width: 1100px) {
  .kpis { grid-template-columns: repeat(3, 1fr); }
  .kpi:nth-child(3) { border-right: 0; }
  .kpi:nth-child(-n+3) { border-bottom: 1px solid var(--line); }
  .stats-grid { grid-template-columns: 1fr; }
  .awards { grid-template-columns: repeat(2, 1fr); }
  .award, .award.feat { grid-column: span 1; }
  .menu { display: none; }
  .burger { display: flex; }
  .podium { grid-template-columns: repeat(2, 1fr); }
  .prize-in { grid-template-columns: 1fr; }
  .stage-list { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 860px) {
  .leaders { grid-template-columns: 1fr 1fr; }
  .at-row { grid-template-columns: repeat(3, 1fr); }
  .casters { grid-template-columns: 1fr 1fr; }
  .partners-in { flex-direction: column; gap: 14px; }
  .partner-row { gap: 22px; }
  .pt img { height: 26px; }
  .pt .hs { font-size: 23px; }
  .pt .hs svg { width: 22px; height: 22px; }
  .countdown-row, .grid-2, .signup, .rules, .news { grid-template-columns: 1fr; }
  .countdown { border-radius: 4px 4px 0 0; }
  .now-stage { border-left: 1px solid var(--line); border-top: 0; border-radius: 0 0 4px 4px; }
  .facts { grid-template-columns: 1fr 1fr; }
  .fact:nth-child(2) { border-right: 0; }
  .fact:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .signup-info { position: static; }
  .stages .stg small { display: none; }
}
@media (max-width: 600px) {
  .wrap, .nav-in { width: calc(100% - 32px); }
  .ticker { height: 62px; }
  .ticker-all { display: none; }
  .tk { width: 140px; }
  .nav-in { height: 58px; gap: 12px; }
  .icon-btn { display: none; }
  .nav-right .lang-btn { height: 36px; min-width: 44px; padding: 0 8px; font-size: 14px; }
  .nav-right .btn { height: 36px; padding: 0 12px; font-size: 14px; }
  .stages { overflow-x: auto; grid-template-columns: repeat(5, minmax(84px, 1fr)); }
  .stg b { font-size: 12px; }
  .hero { height: auto; min-height: 0; max-height: none; }
  .hero-in { flex-direction: column; align-items: flex-start; gap: 18px; padding: 36px 0 34px; }
  .hero-mark { width: min(220px, 60vw); }
  .hero-cta { flex-direction: column; width: 100%; }
  .hero-meta { gap: 7px; font-size: 12px; }
  .hero-meta .yr { display: none; }
  .kpis { grid-template-columns: 1fr 1fr; }
  .kpi { border-right: 1px solid var(--line) !important; border-bottom: 1px solid var(--line); }
  .kpi:nth-child(2n) { border-right: 0 !important; }
  .kpi b { font-size: 36px; }
  .leaders { grid-template-columns: 1fr; }
  .awards { grid-template-columns: 1fr; }
  .award.feat { padding: 18px; }
  .award.feat .aw-medal { width: 84px; height: 84px; }
  .award.feat .aw-body h4 { font-size: 24px; }
  .award { flex-direction: row; }
  .award.feat .aw-medal b { font-size: 19px; }
  .aw-medal { width: 64px; height: 64px; }
  .aw-medal b { font-size: 14px; }
  .at-row { grid-template-columns: 1fr 1fr; }
  .hide-sm { display: none; }
  .hero-cta .btn { width: 100%; }
  .hero-cta .btn { width: 100%; }
  .cd-grid div { padding: 0 12px; }
  .cd-grid b { font-size: 46px; }
  .ns-name { font-size: 28px; }
  .facts { grid-template-columns: 1fr; }
  .fact { border-right: 0 !important; border-bottom: 1px solid var(--line); }
  .fact:last-child { border-bottom: 0; }
  .stage-list { grid-template-columns: 1fr; }
  .podium { grid-template-columns: 1fr 1fr; }
  .form { padding: 4px 18px 22px; }
  .grid2, .roster { grid-template-columns: 1fr; }
  .player { grid-template-columns: 32px 1fr; gap: 8px; }
  .foot-cols { grid-template-columns: 1fr 1fr; }
  .strip-nav { display: none; }
  .strip-bracket { width: 84px; }
  .sec-note { margin-left: 0; width: 100%; }
}

/* =========================================================
   动效
   ========================================================= */
/* 滚动进场：JS 只给视口外的元素加 .rv，避免无 JS 或截图时内容消失 */
.rv { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .8s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0s); }
.rv.in { opacity: 1; transform: none; }
.sec-title h2::before { transform-origin: 50% 100%; transition: transform .6s cubic-bezier(.2,.7,.2,1) .15s; }
.sec-title.rv:not(.in) h2::before { transform: skewX(-12deg) scaleY(0); }

/* 首屏：标志浮动 + 光晕呼吸 + 标题扫出 */
@keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes breathe { 0%, 100% { opacity: .12; } 50% { opacity: .42; } }
.h-cn { background: linear-gradient(90deg, #fff 0 45%, #f4ffc0 50%, #fff 55% 100%); background-size: 260% 100%; background-position: 100% 0; -webkit-background-clip: text; background-clip: text; color: transparent; animation: wipe 1.1s cubic-bezier(.2,.7,.2,1) .25s both, glint 7s ease-in-out 2s infinite; }
@keyframes wipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes glint { 0%, 80% { background-position: 100% 0; } 100% { background-position: 0 0; } }
.h-sub { animation: rise .7s cubic-bezier(.2,.7,.2,1) .55s both; }
.hero-meta { animation: rise .6s cubic-bezier(.2,.7,.2,1) .1s both; }
.hero-cta { animation: rise .7s cubic-bezier(.2,.7,.2,1) .7s both; }

/* 按钮：悬停扫光；主按钮定时扫光 */
.btn { position: relative; overflow: hidden; }
.btn::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent); transform: skewX(-20deg); opacity: 0; }
.btn:hover::after { animation: sheen .7s ease; }
.hero-cta .btn-red::after { animation: sheen 1s ease 2.2s, sheen-loop 5s ease 4s infinite; }
@keyframes sheen { 0% { left: -60%; opacity: 1; } 100% { left: 130%; opacity: 1; } }
@keyframes sheen-loop { 0%, 82% { left: -60%; opacity: 0; } 83% { opacity: 1; } 100% { left: 130%; opacity: 1; } }
.btn:active { transform: translateY(1px) scale(.98); }

/* 比分条：自动滚动，悬停暂停 */
.ticker-track.auto { overflow: hidden; }
.ticker-run { display: flex; width: max-content; animation: tick-run var(--tick-dur, 40s) linear infinite; }
.ticker-track:hover .ticker-run { animation-play-state: paused; }
@keyframes tick-run { to { transform: translateX(-50%); } }
.tk { transition: background .2s; }
.tk:hover { background: var(--panel); }

/* 赛季进度：当前段流光 + 节点脉冲 */
.stg.now::after { background: linear-gradient(90deg, var(--red-2), var(--red) 40%, #f4ffc0 50%, var(--red) 60%, var(--red-2)); background-size: 300% 100%; animation: flow 2.8s linear infinite; }
@keyframes flow { from { background-position: 100% 0; } to { background-position: -50% 0; } }
.stg.now .node { animation: node-pulse 2s ease-out infinite; }
@keyframes node-pulse { 0% { box-shadow: 0 0 0 0 rgba(205,238,44,.55); } 100% { box-shadow: 0 0 0 10px rgba(205,238,44,0); } }

/* 冠名带：光扫过 */
.partners { position: relative; overflow: hidden; }
.partners::after { content: ""; position: absolute; top: 0; bottom: 0; left: -30%; width: 22%; background: linear-gradient(100deg, transparent, rgba(205,238,44,.09), rgba(255,255,255,.08), transparent); transform: skewX(-18deg); animation: band-sweep 6s ease-in-out 1.5s infinite; pointer-events: none; }
@keyframes band-sweep { 0% { left: -30%; } 45%, 100% { left: 120%; } }
.pt { transition: opacity .2s, transform .25s cubic-bezier(.2,.7,.2,1), filter .25s; }
.pt:hover { transform: translateY(-2px) scale(1.04); filter: drop-shadow(0 6px 18px rgba(205,238,44,.25)); }

/* 卡片悬停：浮起 + 亮边 */
.mc, .nc, .caster, .fact, .stage-list li, .rules li, .bm, .ch, .panel.table-card, .stat-pair div { transition: transform .25s cubic-bezier(.2,.7,.2,1), border-color .2s, box-shadow .25s, background .2s; }
.mc:hover, .caster:hover, .stage-list li:hover, .rules li:hover { transform: translateY(-3px); border-color: rgba(205,238,44,.45); box-shadow: 0 14px 30px -18px rgba(205,238,44,.35); }
.caster:hover .cs-sil { fill: #2c3640; }
.cs-mic { transition: transform .25s; }
.caster:hover .cs-mic { transform: scale(1.12) rotate(-8deg); }

/* 直播间：扫描线 + 播放键光圈 */
@keyframes scan-move { to { top: 100%; } }
@keyframes ring { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.7); opacity: 0; } }
.live-state.offline i { animation: pulse 2.4s infinite; }

/* 倒计时：数字翻动 */
.cd-grid b.flip { animation: flip .45s cubic-bezier(.2,.7,.2,1); }
@keyframes flip { 0% { transform: translateY(-35%); opacity: 0; } 100% { transform: none; opacity: 1; } }

/* 数字滚动（已报名队伍等） */
[data-count-teams] { font-variant-numeric: tabular-nums; }

/* 报名表：聚焦时这一行亮起 */
.player { transition: transform .2s; }
.player:focus-within .num { background: var(--red); color: var(--on-red); }
.player:focus-within { transform: translateX(3px); }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } .rv { opacity: 1; transform: none; } .h-cn { clip-path: none; } }

/* 英文模式：去掉和标题重复的小号英文副标 */
html[data-lang="en"] .sec-en, html[data-lang="en"] .kpi small em, html[data-lang="en"] .leader header em,
html[data-lang="en"] .fact .lb small, html[data-lang="en"] .aw-body small, html[data-lang="en"] .day small,
html[data-lang="en"] .cs-body small em, html[data-lang="en"] .stage-list small, html[data-lang="en"] .pd small { display: none; }
.tk .st { white-space: nowrap; gap: 6px; }
.tk .st span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

.help .wx { color: #fff; font-family: var(--cond); font-weight: 400; letter-spacing: .04em; }
.wx-copy { margin-left: 6px; padding: 2px 8px; border: 1px solid var(--line-2); border-radius: 2px; background: transparent; font-size: 12px; cursor: pointer; }
.foot-wx { display: block; padding: 4px 0; font-size: 13px; color: var(--muted); }
.foot-wx b { color: #fff; font-weight: 600; }

.id-warn { margin: -4px 0 12px; padding: 8px 12px; border-left: 3px solid #ffc04d; background: rgba(255,192,77,.08); color: #ffd27a; font-size: 13px; }
.lbl-note { margin-left: 8px; font-size: 11px; font-weight: 600; color: var(--red); }

/* ===== 子页面页头 ===== */
.page-head { position: relative; overflow: hidden; isolation: isolate; padding: 64px 0 48px; background: radial-gradient(120% 140% at 0% 0%, rgba(205,238,44,.10), transparent 55%), #07090b; border-bottom: 1px solid var(--line); }
.page-head::after { content: ""; position: absolute; inset: 0; z-index: -1; background: repeating-linear-gradient(115deg, transparent 0 22px, rgba(255,255,255,.018) 22px 23px); }
.page-head-art span { position: absolute; right: -1%; bottom: -.18em; z-index: -1; font-family: var(--cond); font-size: clamp(88px, 15vw, 220px); line-height: 1; letter-spacing: .01em; color: rgba(255,255,255,.04); white-space: nowrap; pointer-events: none; }
.page-head-in .sec-en { color: var(--red); }
.page-head-in h1 { position: relative; margin-top: 8px; padding-left: 20px; font-family: var(--sc); font-weight: 900; font-size: clamp(40px, 5.6vw, 68px); line-height: 1; }
.page-head-in h1::before { content: ""; position: absolute; left: 0; top: 6%; bottom: 6%; width: 8px; background: var(--red); transform: skewX(-12deg); }
.page-head-in p { margin-top: 14px; color: var(--muted); max-width: 640px; }
.page-head-in .pill-live { margin-top: 18px; }
.page-head + section.wrap { margin-top: 40px; }
@media (max-width: 640px) { .page-head { padding: 40px 0 32px; } }

/* ===== 多个直播间 ===== */
.rooms { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.room { background: var(--panel); border: 1px solid var(--line); border-radius: 3px; transition: border-color .15s, background .15s; }
.room-name { flex: 1; display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.room-name b { font-size: 15px; }
.room-name small { font-size: 12px; color: var(--muted); }
.room-st { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: var(--faint); white-space: nowrap; }
.room-st i { width: 6px; height: 6px; border-radius: 50%; background: var(--faint); }
.room-st.live { color: #ff5a5f; } .room-st.live i { background: #ff5a5f; animation: pulse 1.6s infinite; }
.room-st.upcoming { color: var(--red); } .room-st.upcoming i { background: var(--red); }
.room-links { display: flex; gap: 6px; padding: 0 12px 12px; }
.pf { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; height: 32px; padding: 0 10px; border-radius: 3px; font-size: 12px; font-weight: 700; color: #fff; border: 1px solid transparent; white-space: nowrap; overflow: hidden; }
.pf small { font-weight: 400; opacity: .75; overflow: hidden; text-overflow: ellipsis; }
.pf.bilibili { background: #fb7299; }
.pf.douyin { background: #161823; border-color: #2c2f3d; box-shadow: inset 2px 0 0 #25f4ee, inset -2px 0 0 #fe2c55; }
.pf.tbd { background: var(--panel-2); border-color: var(--line); box-shadow: none; color: var(--muted); }
a.pf:hover { filter: brightness(1.12); }
.mc-room { display: flex; align-items: center; gap: 6px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); font-size: 11px; font-weight: 600; color: var(--muted); }
.mc-room i { width: 6px; height: 6px; border-radius: 50%; background: var(--red); }
.mc-room:hover { color: var(--red); }

/* ===== 手机字号：整体收一档（放在最后，覆盖上面的手机规则） ===== */
@media (max-width: 600px) {
  body { font-size: 14px; }
  /* 比分条 + 导航 */
  .ticker { height: 50px; }
  .tk { width: 124px; padding: 5px 10px 4px; }
  .tk .st { font-size: 9px; }
  .tk .t, .tk .s { font-size: 12px; }
  .nav-in { height: 52px; gap: 10px; }
  .brand { gap: 8px; }
  .brand-crest { width: 32px; height: 32px; }
  .brand-text b { font-size: 16px; }
  .brand-text small { font-size: 10px; }
  .nav-right { gap: 6px; }
  .nav-right .lang-btn { height: 32px; min-width: 38px; font-size: 12px; }
  .nav-right .btn { height: 32px; padding: 0 10px; font-size: 13px; }
  .burger { width: 32px; height: 32px; }
  .drawer a { padding: 11px 0; font-size: 14px; }
  .stg { padding: 7px 6px 11px; }
  .stg small { font-size: 9px; }
  .stg b { font-size: 11px; }
  /* 主视觉 */
  .hero-in { gap: 14px; padding: 26px 0 28px; }
  .hero-mark { width: 120px; }
  .h-cn { font-size: 50px; }
  .h-sub { margin-top: 8px; font-size: 15px; }
  .h-sub em { margin-left: 6px; }
  .hero-meta { font-size: 11px; gap: 6px; }
  .hero-cta { flex-direction: row; gap: 8px; margin-top: 18px; }
  .hero-cta .btn { width: auto; flex: 1; }
  .btn-lg { height: 44px; padding: 0 16px; font-size: 15px; }
  .partners { padding: 14px 0; }
  .partners-in { gap: 8px; }
  .partner-row { gap: 18px; }
  .pt img { height: 24px; }
  .pt .hs { font-size: 20px; gap: 6px; }
  .pt .hs svg { width: 19px; height: 19px; }
  /* 倒计时 + 当前阶段 */
  .cd-label { font-size: 14px; }
  .cd-grid { margin-top: 10px; }
  .cd-grid div { padding: 0 10px; }
  .cd-grid b { font-size: 34px; }
  .cd-grid span { font-size: 11px; }
  .ns-name { font-size: 22px; }
  .ns-desc { font-size: 13px; }
  .ns-stats b { font-size: 20px; }
  /* 区块标题 */
  section.wrap { margin-top: 44px; }
  .sec-title { gap: 8px; margin-bottom: 14px; }
  .sec-title h2 { font-size: 22px; padding-left: 12px; }
  .sec-title h2::before { width: 4px; }
  .sec-en { font-size: 13px; }
  .sec-note { font-size: 12px; }
  .page-head { padding: 26px 0 22px; }
  .page-head-in h1 { font-size: 30px; padding-left: 14px; }
  .page-head-in h1::before { width: 5px; }
  .page-head-in p { margin-top: 8px; font-size: 13px; }
  .page-head-art span { font-size: 60px; }
  .page-head + section.wrap { margin-top: 28px; }
  /* 赛程 / 直播 / 公告 */
  .mc { width: 180px; padding: 8px 10px; }
  .mc .nm { font-size: 13px; }
  .room-name b { font-size: 14px; }
  .cs-body b { font-size: 17px; }
  .caster.tbd .cs-photo::after { font-size: 40px; }
  /* 赛制 / 奖金 */
  .fact .v { font-size: 42px; margin: 10px 0 6px; }
  .fact .v.cn { font-size: 30px; }
  .stage-list li b { font-size: 17px; }
  .pp-label { font-size: 20px; }
  .pp-value { font-size: 40px; }
  .pd .rk { font-size: 32px; }
  .pd b { font-size: 15px; }
  /* 数据 / 奖项 */
  .kpi b { font-size: 28px; }
  .sp-head h3, .at-head h3 { font-size: 18px; }
  .leader header span { font-size: 15px; }
  .ld-val b { font-size: 24px; }
  .award.feat .aw-body h4 { font-size: 20px; }
  .award h4 { font-size: 17px; }
  /* 战队 / 报名 */
  .cta-card h3 { font-size: 22px; }
  .cta-art .cta-badge { width: 130px; height: 130px; }
  .tc-head h3, .signup-info h3 { font-size: 18px; }
  .standings .rk { font-size: 14px; width: 26px; }
  .steps b { font-size: 20px; }
  .form legend { font-size: 16px; }
  .foot-brand b { font-size: 16px; }
  /* 赛制卡两列 */
  .facts { grid-template-columns: 1fr 1fr; }
  .fact { padding: 16px 14px; border-right: 1px solid var(--line) !important; }
  .fact:nth-child(2n) { border-right: 0 !important; }
  .fact:nth-last-child(-n+2) { border-bottom: 0; }
  .fact .lb small { display: none; }
  .fact .v { font-size: 30px; margin: 8px 0 4px; }
  .fact .v.cn { font-size: 24px; }
  .fact p { font-size: 12px; line-height: 1.5; }
  /* 战队页：名单在前，报名卡压扁放后面 */
  #teams .table-card { order: -1; }
  .cta-card { min-height: 0; padding: 20px; justify-content: center; }
  .cta-art { position: relative; height: auto; margin-bottom: 10px; }
  .cta-card p { font-size: 13px; }
  .st-ok, .st-wait { white-space: nowrap; }
}

/* ===== 公告列表 ===== */
.news { display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; }
.nc { display: grid; grid-template-columns: 64px auto 1fr 14px; align-items: center; gap: 14px; padding: 14px 18px; border-bottom: 1px solid var(--line); transition: background .15s; }
.nc:last-child { border-bottom: 0; }
.nc:hover { background: var(--panel-2); }
.nc-date { font-family: var(--cond); font-size: 15px; letter-spacing: .04em; color: var(--muted); white-space: nowrap; }
.nc-tag { font-size: 11px; font-weight: 700; color: var(--red); padding: 2px 8px; border: 1px solid rgba(205,238,44,.35); border-radius: 2px; white-space: nowrap; }
.nc-title { font-size: 15px; font-weight: 600; min-width: 0; }
.nc svg { width: 14px; height: 14px; color: var(--faint); }
.nc:hover svg { color: var(--red); }
@media (max-width: 600px) {
  .nc { grid-template-columns: auto 1fr 12px; grid-template-areas: "date tag arrow" "title title arrow"; gap: 4px 10px; padding: 12px 14px; }
  .nc-date { grid-area: date; font-size: 13px; }
  .nc-tag { grid-area: tag; justify-self: start; }
  .nc-title { grid-area: title; font-size: 14px; }
  .nc svg { grid-area: arrow; }
}

.room-top { display: flex; align-items: center; gap: 10px; padding: 14px 14px 10px; }
.room.live, .room:target { border-color: var(--red); }
.room:target { background: rgba(205,238,44,.05); }
@media (max-width: 600px) { .rooms { grid-template-columns: 1fr; gap: 8px; } }

/* ===== 解说席：横向小卡（头像 + 角色 + 名字），不再用大照片位 ===== */
.caster { display: flex; align-items: center; gap: 12px; padding: 12px; }
.cs-photo { flex: none; width: 56px; height: 56px; aspect-ratio: auto; border-radius: 50%; place-items: end center; }
.cs-sil { width: 80%; }
.caster.tbd .cs-photo::after { font-size: 22px; top: 42%; }
.cs-mic { right: -2px; bottom: -2px; width: 20px; height: 20px; }
.cs-mic svg { width: 11px; height: 11px; }
.cs-photo { overflow: visible; }
.cs-photo img, .cs-sil { border-radius: 50%; overflow: hidden; }
.cs-body { flex: 1; min-width: 0; padding: 0; border-top: 0; gap: 1px; }
.cs-body b { font-size: 16px; }
.cs-body span { font-size: 12px; }
@media (max-width: 600px) {
  .casters { grid-template-columns: 1fr; gap: 8px; }
  .cs-body b { font-size: 15px; }
  .caster.tbd .cs-photo::after { font-size: 20px; }
}