:root {
    --ink: #142033;
    --muted: #5d6b80;
    --line: #e4ebf5;
    --paper: #f5f7fb;
    --card: #ffffff;
    --navy: #071426;
    --navy-2: #10243f;
    --gold: #c6a15a;
    --gold-2: #e8d7a8;
    --live: #d23b3b;
    --ok: #1f8a4c;
    --shadow: 0 10px 30px rgba(16, 36, 63, .08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--ink);
    background: var(--paper) url("/assets/img/bg2.png") right 160px no-repeat;
    font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    line-height: 1.65;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; }
.wrap { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.site-header {
    position: sticky;
    top: 0;
    z-index: 20;
    color: #fff;
    background:
        linear-gradient(180deg, rgba(7, 20, 38, .92), rgba(7, 20, 38, .96)),
        url("/assets/img/bg1.png") center / cover no-repeat;
    border-bottom: 3px solid var(--gold);
}
.header-bar { display: flex; align-items: center; min-height: 74px; gap: 28px; }
.brand { display: flex; align-items: center; gap: 10px; font-size: 26px; font-weight: 700; letter-spacing: .08em; }
.brand span { background: linear-gradient(90deg, #fff, var(--gold-2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.main-nav { display: flex; gap: 6px; margin-left: auto; }
.main-nav a { padding: 8px 14px; border-radius: 999px; color: #d5deea; }
.main-nav a.on, .main-nav a:hover { color: #1a1408; background: linear-gradient(180deg, #f3e6c4, var(--gold)); }
.nav-toggle, .nav-btn { display: none; }
.league-bar { background: #fff; border-bottom: 1px solid var(--line); }
.league-bar .wrap { display: flex; gap: 8px; overflow-x: auto; padding: 12px 0; }
.league-bar a {
    flex: 0 0 auto;
    padding: 6px 12px;
    border-radius: 999px;
    background: #f3f6fb;
    color: #24344c;
    font-size: 14px;
}
.league-bar a:hover { background: #10243f; color: #fff; }
main { padding: 22px 0 48px; }
.hero {
    margin-bottom: 18px;
    padding: 28px 32px;
    border-radius: 18px;
    color: #fff;
    background:
        linear-gradient(115deg, rgba(7, 20, 38, .88), rgba(16, 36, 63, .72)),
        #10243f;
    box-shadow: var(--shadow);
}
.hero h1 { margin: 6px 0 8px; font-size: 42px; letter-spacing: .12em; }
.hero p { margin: 0; max-width: 680px; color: #d7e1ee; }
.eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; color: var(--gold-2); letter-spacing: .16em; font-size: 13px; }
.hero-mark { width: 220px; height: auto; display: block; margin-bottom: 10px; border-radius: 8px; }
.panel, .hero { }
.panel {
    margin-bottom: 18px;
    padding: 22px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid #fff;
    border-radius: 18px;
    box-shadow: var(--shadow);
}
.panel h1, .panel h2 { margin: 0 0 12px; }
.panel h1 { font-size: 32px; }
.lead { margin-top: 0; color: var(--muted); }
.section-head, .panel > .section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.section-head a { color: #8a6a2f; }
.hot-scroll { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 6px; }
.hot-card {
    flex: 0 0 230px;
    padding: 14px;
    border-radius: 16px;
    background: linear-gradient(180deg, #fff, #f8f4ea);
    border: 1px solid #efe4cc;
}
.hot-top, .hot-go { display: flex; justify-content: space-between; color: var(--muted); font-size: 13px; }
.hot-teams { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; text-align: center; font-size: 14px; }
.hot-teams img { display: block; margin: 0 auto 6px; object-fit: contain; }
.hot-go { display: block; width: 127px; height: 37px; margin: 4px auto 0; object-fit: contain; }
.match-list { display: flex; flex-direction: column; gap: 8px; }
.league-block h2 { margin: 16px 0 8px; font-size: 18px; }
.league-block h2 a { color: #8a6a2f; }
.match {
    display: grid;
    grid-template-columns: 108px minmax(0, 1fr) 118px;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid var(--line);
}
.match-time { display: flex; flex-direction: column; gap: 4px; color: var(--muted); font-size: 13px; }
.match-teams { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 10px; align-items: center; min-width: 0; }
.team { display: flex; align-items: center; gap: 8px; min-width: 0; }
.team em { font-style: normal; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.team img { object-fit: contain; background: #fff; border-radius: 50%; }
.team-away { justify-content: flex-end; }
.score { min-width: 72px; text-align: center; font-size: 18px; letter-spacing: .04em; }
.watch {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    height: 38px;
    padding: 0 12px;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(180deg, #1b355c, #10243f);
}
.watch img { width: 18px; height: 12px; object-fit: contain; }
.state { display: inline-flex; width: fit-content; padding: 1px 8px; border-radius: 999px; font-size: 12px; }
.state-live { color: #fff; background: var(--live); }
.state-wait { color: #24507a; background: #e7f0fa; }
.state-end { color: var(--ok); background: #e7f6ee; }
.date-nav, .pager { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 16px; }
.date-nav a, .pager a { padding: 6px 12px; border-radius: 999px; background: #eef3f9; }
.date-nav a.on, .pager a.on { color: #1a1408; background: var(--gold); }
.count { color: var(--muted); }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.feed { list-style: none; margin: 0; padding: 0; }
.feed li + li { border-top: 1px solid var(--line); }
.feed a { display: flex; gap: 12px; align-items: center; padding: 12px 0; }
.feed img { width: 96px; height: 64px; object-fit: cover; border-radius: 8px; background: #eef3f9; }
.feed span { display: flex; flex-direction: column; min-width: 0; }
.feed strong { font-weight: 650; }
.feed em { color: var(--muted); font-style: normal; font-size: 13px; }
.feed-block a { padding: 14px 0; }
.empty { color: var(--muted); }
.crumb { margin: 0 0 12px; color: var(--muted); font-size: 14px; }
.crumb a { color: #8a6a2f; }
.scoreboard { text-align: center; }
.kick { color: var(--muted); }
.board { display: grid; grid-template-columns: 1fr auto 1fr; gap: 18px; align-items: center; margin: 18px 0; }
.side { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.side img { object-fit: contain; }
.board-score { font-size: 40px; letter-spacing: .08em; }
.signals { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.signals a {
    min-width: 140px;
    padding: 12px 18px;
    border-radius: 12px;
    color: #1a1408;
    background: linear-gradient(180deg, #f6e7c3, var(--gold));
    font-weight: 700;
}
.hint { color: var(--muted); font-size: 14px; }
.lines { list-style: none; padding: 0; }
.lines a { display: block; margin: 8px 0; padding: 12px 14px; border-radius: 12px; background: #f6f8fc; border: 1px solid var(--line); }
.article .content { font-size: 17px; }
.article .content p { margin: 0 0 14px; }
.article .content img { display: block; margin: 8px auto; border-radius: 12px; }
.seo-copy p { color: #31445f; }
.site-footer { color: #c9d4e4; background: var(--navy); padding: 28px 0 36px; }
.footer-name { margin: 0 0 8px; color: #fff; font-size: 20px; letter-spacing: .12em; }
.footer-links { display: flex; flex-wrap: wrap; gap: 10px 14px; }
.footer-links a { color: var(--gold-2); }
.copy { color: #8ea0b8; }
@media (max-width: 860px) {
    .hero, .split, .match, .board { grid-template-columns: 1fr; }
    .hero h1 { font-size: 32px; }
    .nav-btn {
        display: inline-flex;
        margin-left: auto;
        padding: 6px 12px;
        border: 1px solid rgba(255,255,255,.3);
        border-radius: 999px;
    }
    .main-nav {
        display: none;
        position: absolute;
        left: 0;
        right: 0;
        top: 74px;
        flex-direction: column;
        padding: 10px 16px 16px;
        background: #071426;
    }
    .nav-toggle:checked ~ .main-nav { display: flex; }
    .header-bar { position: relative; }
    .team-away { justify-content: flex-start; }
    .watch { width: 100%; }
}