:root { --ink:#102a43; --muted:#627d98; --line:#d9e2ec; --paper:#f6f9fc; --blue:#0967b5; --navy:#063b70; --orange:#f59e0b; --green:#0f9d72; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif; }
button,input,select { font:inherit; }
.hero { color:#fff; background:radial-gradient(circle at 80% 10%, #1976c6 0, transparent 30%), linear-gradient(135deg, #052b51, #075b9d); }
.hero-inner,.page-shell { width:min(1120px, calc(100% - 32px)); margin:auto; }
.hero-inner { padding:52px 0 44px; position:relative; }
.eyebrow,.section-kicker { margin:0 0 8px; font-size:13px; letter-spacing:.13em; font-weight:700; color:#f8c463; }
h1 { font-size:clamp(28px, 5vw, 42px); letter-spacing:.02em; margin:0; }
.subtitle { margin:10px 0 28px; opacity:.85; }
.hero-compact .hero-inner { padding-bottom:34px; }.hero-link { display:inline-block; margin:-14px 0 22px; color:#fff; font-size:14px; font-weight:700; text-decoration:none; border-bottom:1px solid #f8c463; padding-bottom:3px; }.hero-link:hover { color:#f8c463; }
.search { height:54px; max-width:650px; display:flex; align-items:center; gap:10px; padding:0 14px; border-radius:10px; background:#fff; color:#486581; box-shadow:0 12px 28px #021d383b; }
.search span { font-size:26px; line-height:1; transform:rotate(-20deg); }.search input,.search input[type="search"] { min-width:0; flex:1; border:0 !important; outline:0; background:#fff !important; background-color:#fff !important; -webkit-appearance:none; appearance:none; border-radius:0; box-shadow:none !important; color:var(--ink); font-size:16px; }.search input::-webkit-search-decoration,.search input::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; }.search input::placeholder { color:#9aa9b8; opacity:1; }.search kbd { font-size:11px; color:#829ab1; border:1px solid #d9e2ec; border-radius:3px; padding:2px 5px; }
.search-results { position:absolute; z-index:3; max-width:650px; width:calc(100% - 32px); background:#fff; color:var(--ink); border-radius:0 0 10px 10px; overflow:hidden; box-shadow:0 12px 28px #021d3840; }.search-results:empty { display:none; }.result-button { width:100%; text-align:left; padding:13px 16px; border:0; border-top:1px solid #edf2f7; background:#fff; cursor:pointer; }.result-button:hover { background:#f0f7ff; }.result-button small { color:var(--muted); margin-left:8px; }
.page-shell { padding:26px 0 52px; }.intro { display:grid; grid-template-columns:repeat(3, 1fr) 2fr; align-items:center; gap:18px; padding:20px 24px; margin-top:-18px; background:#fff; border-radius:10px; box-shadow:0 4px 18px #102a4310; }.intro div { border-right:1px solid var(--line); }.intro strong { display:block; font-size:24px; color:var(--blue); }.intro span,.intro p { color:var(--muted); font-size:13px; }.intro p { margin:0; line-height:1.65; }
.division-tabs { display:flex; gap:8px; margin:34px 0 20px; }.division-tab,.group-tab { border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer; border-radius:7px; }.division-tab { padding:12px 18px; font-weight:700; }.division-tab small { color:var(--muted); margin-left:5px; }.division-tab.active { color:#fff; border-color:var(--blue); background:var(--blue); }.division-tab.active small { color:#d9efff; }
.group-browser,.schedule-section { background:#fff; border-radius:12px; padding:26px; box-shadow:0 4px 18px #102a430c; }.schedule-section { margin-top:24px; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:16px; border-bottom:1px solid var(--line); padding-bottom:18px; }.section-heading.compact { align-items:center; }.section-heading h2 { margin:0; font-size:22px; }.group-tabs { display:flex; flex-wrap:wrap; gap:6px; }.group-tab { width:35px; height:35px; font-weight:800; }.group-tab.active { background:#e6f4ff; color:var(--blue); border-color:#91caff; }
.group-meta { padding:18px 0 12px; color:var(--muted); font-size:14px; }.standings-panel { margin-bottom:20px; border:1px solid #d8e8f5; border-radius:10px; overflow:hidden; background:#fbfdff; }.standings-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 16px; background:#edf7ff; border-bottom:1px solid #d8e8f5; }.standings-heading h3 { margin:0; font-size:16px; }.standings-heading span { color:var(--blue); font-size:12px; font-weight:700; }.standings-scroll { overflow-x:auto; }.standings-table { width:100%; min-width:590px; border-collapse:collapse; font-size:13px; }.standings-table.has-tqb { min-width:650px; }.standings-table th,.standings-table td { padding:11px 12px; text-align:center; border-bottom:1px solid #e8eef4; white-space:nowrap; }.standings-table th { color:var(--muted); font-size:12px; font-weight:700; background:#fff; }.standings-table th:nth-child(2),.standings-table td:nth-child(2) { min-width:190px; text-align:left; }.standings-table tbody tr:last-child td { border-bottom:0; }.standings-table tbody tr:hover { background:#f5faff; }.rank-badge { display:inline-grid; place-items:center; width:25px; height:25px; border-radius:50%; background:#e8f2fa; color:var(--navy); font-weight:800; }.rank-badge.rank-1 { color:#815609; background:#fff1c7; }.tie-label { margin-left:5px; color:var(--muted); font-size:10px; }.standing-team { padding:3px 0; border:0; background:transparent; color:var(--ink); font-weight:700; text-align:left; cursor:pointer; }.standing-team:hover { color:var(--blue); text-decoration:underline; }.points-cell { color:var(--blue); font-size:16px; font-weight:800; }.standings-rule { margin:0; padding:11px 16px; border-top:1px solid #e8eef4; background:#fff; color:var(--muted); font-size:12px; line-height:1.65; }.team-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:10px; }.team-card { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:14px 16px; text-align:left; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); cursor:pointer; }.team-card:hover { border-color:#73b7ec; background:#f7fbff; }.team-card .arrow { color:var(--blue); font-size:20px; }.mini-schedule { margin-top:24px; }.mini-schedule h3 { font-size:16px; margin:0 0 10px; }.match-row { display:grid; grid-template-columns:74px 1fr 70px; gap:12px; align-items:center; padding:11px 0; border-top:1px solid #edf2f7; font-size:14px; }.match-date { color:var(--muted); font-size:12px; }.match-teams { font-weight:600; }.match-teams span { color:var(--muted); font-weight:400; margin:0 5px; }.score { text-align:right; font-weight:800; }.score.completed { color:var(--green); }.score.pending { color:#9b6b16; font-weight:600; }
select { padding:8px 10px; border:1px solid var(--line); border-radius:6px; color:var(--ink); background:#fff; }.schedule-list { margin-top:4px; }.date-heading { margin:22px 0 4px; color:var(--blue); font-size:15px; }.schedule-list .match-row { grid-template-columns:86px 1fr 90px; }.schedule-list .match-info { font-size:12px; color:var(--muted); margin-top:3px; }
.team-dialog { width:min(700px, calc(100% - 28px)); max-height:calc(100vh - 40px); border:0; border-radius:12px; padding:28px; color:var(--ink); box-shadow:0 20px 60px #001a3380; }.team-dialog::backdrop { background:#08233e88; }.close-dialog { position:absolute; right:14px; top:10px; border:0; background:transparent; color:var(--muted); font-size:30px; cursor:pointer; }.team-dialog h2 { padding-right:28px; margin:0; }.team-badge { color:var(--blue); font-weight:700; margin:7px 0 20px; }.detail-empty { color:var(--muted); padding:12px 0; }
footer { padding:22px; text-align:center; font-size:12px; color:var(--muted); }
.bracket-page { padding-top:30px; }.bracket-intro { display:flex; justify-content:space-between; align-items:end; gap:24px; background:#fff; border-radius:12px; padding:24px 26px; box-shadow:0 4px 18px #102a430c; }.bracket-intro h2 { margin:0; font-size:24px; }.bracket-intro p:last-child { max-width:500px; margin:0; color:var(--muted); font-size:14px; line-height:1.65; }.bracket-tabs { margin-top:24px; }.bracket-legend { margin:0 0 12px; color:var(--muted); font-size:13px; }.legend-dot { display:inline-block; width:9px; height:9px; border-radius:50%; margin:0 5px 0 14px; }.legend-dot:first-child { margin-left:0; }.legend-dot.done { background:var(--green); }.legend-dot.pending { background:var(--orange); }.bracket-section { background:#fff; border-radius:12px; padding:24px 0 26px; margin-top:18px; box-shadow:0 4px 18px #102a430c; overflow:hidden; }.bracket-heading { padding:0 26px 18px; border-bottom:1px solid var(--line); }.bracket-heading h2 { margin:0; font-size:20px; }.bracket-heading p { margin:5px 0 0; color:var(--muted); font-size:13px; }.bracket-scroll { overflow-x:auto; padding:20px 26px 4px; }.bracket-grid { display:grid; grid-template-columns:repeat(var(--rounds), minmax(245px, 1fr)); min-width:calc(var(--rounds) * 250px); gap:32px; align-items:stretch; }.bracket-round h3 { margin:0 0 12px; color:var(--blue); font-size:14px; text-align:center; }.bracket-matches { display:flex; min-height:100%; flex-direction:column; justify-content:space-around; gap:14px; }.bracket-round.has-connector .bracket-match { position:relative; }.bracket-round.has-connector .bracket-match::before { content:'←'; position:absolute; left:-25px; top:50%; color:#9db8cf; font-size:18px; transform:translateY(-50%); }.bracket-match { border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; box-shadow:0 2px 8px #102a4308; }.bracket-match.is-complete { border-color:#9cd7c3; }.bracket-match-meta { padding:7px 10px; background:#f5f8fb; color:var(--muted); font-size:11px; }.is-complete .bracket-match-meta { background:#effaf5; color:#257258; }.bracket-team { display:flex; justify-content:space-between; gap:8px; padding:9px 10px; border-top:1px solid #edf2f7; font-size:13px; line-height:1.35; }.bracket-team span { overflow-wrap:anywhere; }.bracket-team strong { color:var(--blue); font-size:16px; }.bracket-stage { padding:7px 10px; background:#fbfdff; border-top:1px solid #edf2f7; color:var(--muted); font-size:11px; line-height:1.45; }
@media (max-width:680px) { body { overflow-x:hidden; }.hero-inner,.page-shell { width:min(100% - 24px, 1120px); }.hero-inner { padding:36px 0 30px; }.subtitle { margin-bottom:22px; }.search { height:50px; padding:0 12px; }.search input { font-size:15px; }.search kbd { display:none; }.intro { grid-template-columns:repeat(3,1fr); gap:8px; padding:16px 14px; }.intro strong { font-size:21px; }.intro span { font-size:12px; }.intro p { grid-column:1/-1; padding-top:10px; border-top:1px solid var(--line); }.intro div:nth-child(3) { border:0; }.group-browser,.schedule-section { padding:18px 14px; }.section-heading { align-items:flex-start; flex-direction:column; }.section-heading.compact { gap:12px; }.group-tabs { width:100%; }.group-tab { flex:1; min-width:35px; }.standings-panel { margin-left:-2px; margin-right:-2px; }.standings-heading,.standings-rule { padding-left:12px; padding-right:12px; }.standings-table { min-width:540px; }.standings-table.has-tqb { min-width:600px; }.standings-table th,.standings-table td { padding:10px 8px; }.standings-table th:nth-child(2),.standings-table td:nth-child(2) { min-width:145px; }.team-grid { grid-template-columns:1fr; }.team-card { min-height:52px; }.match-row,.schedule-list .match-row { grid-template-columns:64px minmax(0,1fr); column-gap:10px; padding:12px 0; }.match-date { line-height:1.55; }.match-teams { overflow-wrap:anywhere; line-height:1.55; }.match-info { line-height:1.45; }.score { grid-column:2; justify-self:start; text-align:left; margin-top:-3px; }.division-tab { flex:1; padding:10px 8px; }.division-tab small { display:block; margin:3px 0 0; }.search-results { width:calc(100% - 24px); }.team-dialog { padding:24px 18px 18px; }.team-dialog .match-row { grid-template-columns:58px minmax(0,1fr); } }
@media (max-width:380px) { h1 { font-size:27px; }.intro { grid-template-columns:repeat(2,1fr); }.intro div:nth-child(2) { border:0; }.intro div:nth-child(3) { border-right:1px solid var(--line); }.division-tabs { margin-top:26px; }.division-tab { font-size:14px; }.group-tab { flex:0 0 35px; } }
@media (max-width:680px) { .bracket-page { padding-top:18px; }.bracket-intro { display:block; padding:20px 16px; }.bracket-intro p:last-child { margin-top:12px; }.bracket-section { margin-top:14px; padding-top:20px; }.bracket-heading { padding:0 16px 16px; }.bracket-scroll { padding:16px 14px 2px; }.bracket-grid { gap:28px; }.bracket-round.has-connector .bracket-match::before { left:-23px; }.hero-compact .hero-inner { padding-bottom:25px; } }
