:root { color-scheme:dark; --bg:#08111f; --panel:#111d2e; --line:#26364b; --muted:#8d9bb0; --text:#f4f7fb; --green:#ff7a45; --live:#35f29a; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--text); background:var(--bg); font-family:Inter,"Noto Sans TC",system-ui,sans-serif; }
button,input { font:inherit; } button { color:inherit; }
.topbar { height:64px; position:sticky; top:0; z-index:20; border-bottom:1px solid var(--line); background:rgba(8,17,31,.96); backdrop-filter:blur(14px); }
.header-inner { width:min(1180px,calc(100% - 32px)); height:100%; margin:auto; display:flex; align-items:center; gap:28px; }
.brand { flex:none; display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; font-size:17px; font-weight:800; letter-spacing:-.6px; }
.brand>span:last-child span { color:var(--green); }
.brand-mark { width:34px; height:34px; display:grid; place-items:center; color:#271107; background:linear-gradient(135deg,#ff9a62,var(--green)); border-radius:10px 4px; box-shadow:0 7px 22px rgba(255,122,69,.22); font-size:11px; transform:skew(-5deg); }
.search-box { width:280px; height:40px; display:flex; align-items:center; gap:9px; padding:0 11px; background:#17263a; border:1px solid transparent; border-radius:8px; transition:.18s; }
.search-box:focus-within { border-color:#555; background:#2b2b2b; }
.search-box svg { width:17px; fill:none; stroke:#aaa; stroke-width:2; }
.search-box input { min-width:0; flex:1; color:#fff; background:none; border:0; outline:0; font-size:12px; }
.search-box kbd { color:#777; background:#1b1b1b; border:1px solid #3a3a3a; border-radius:4px; padding:2px 5px; font-size:9px; }
.main-nav { align-self:stretch; margin-left:auto; display:flex; gap:25px; }
.main-nav a { display:flex; align-items:center; position:relative; color:#aaa; text-decoration:none; font-size:12px; font-weight:600; }
.main-nav a:hover,.main-nav a.active { color:#fff; }
.main-nav a.active::after { content:""; position:absolute; height:3px; left:0; right:0; bottom:0; background:var(--green); border-radius:3px 3px 0 0; }
.match-nav-menu { position:relative; display:flex; }
.nav-match-toggle { position:relative; display:flex; align-items:center; gap:5px; padding:0; color:#aaa; background:none; border:0; font-size:12px; font-weight:700; cursor:pointer; }
.nav-match-toggle:hover,.nav-match-toggle.active { color:#fff; }
.nav-match-toggle.active::after { content:""; position:absolute; height:3px; left:0; right:0; bottom:0; background:var(--green); border-radius:3px 3px 0 0; }
.nav-match-toggle i { color:#718096; font-size:10px; font-style:normal; transition:transform .15s; }
.nav-match-toggle[aria-expanded="true"] i { transform:rotate(180deg); }
.match-sport-menu { width:245px; position:absolute; top:54px; left:50%; z-index:40; transform:translateX(-35%); padding:8px; background:#142238; border:1px solid #30445f; border-radius:12px; box-shadow:0 18px 50px rgba(0,0,0,.45); }
.match-sport-menu[hidden] { display:none; }
.match-sport-menu button { width:100%; min-height:56px; display:grid; grid-template-columns:34px 1fr; grid-template-rows:auto auto; column-gap:10px; padding:8px 10px; color:#dbe4ef; background:none; border:0; border-radius:8px; text-align:left; cursor:pointer; }
.match-sport-menu button:hover,.match-sport-menu button.active { background:#203653; }
.match-sport-menu button>span { grid-row:1/3; align-self:center; display:grid; place-items:center; width:32px; height:32px; background:#0d1929; border-radius:9px; font-size:17px; }
.match-sport-menu strong { align-self:end; font-size:12px; }
.match-sport-menu small { color:#8291a5; font-size:9px; }
.live-indicator { display:flex; align-items:center; gap:7px; color:#aaa; font-size:10px; font-weight:800; letter-spacing:1px; }
.language-toggle { min-width:42px; height:32px; padding:0 9px; color:#ffb08b; background:#1d2c40; border:1px solid #5e402f; border-radius:8px; font-size:10px; font-weight:800; cursor:pointer; }
.language-toggle:hover { color:#fff; border-color:var(--green); }
.live-indicator i,.live-dot { width:7px; height:7px; display:inline-block; border-radius:50%; background:var(--live); box-shadow:0 0 0 3px rgba(53,242,154,.14); }
.score-nav { height:72px; position:sticky; top:64px; z-index:15; border-bottom:1px solid var(--line); background:#0d1929; }
.score-nav-inner { width:min(720px,calc(100% - 24px)); height:100%; margin:auto; display:flex; align-items:center; gap:8px; }
.date-switcher { flex:1; align-self:stretch; display:grid; grid-template-columns:repeat(3,1fr); }
.date-switcher button { position:relative; min-width:120px; padding:8px 15px; color:#929292; background:none; border:0; cursor:pointer; }
.date-switcher button::after { content:""; position:absolute; left:20%; right:20%; bottom:0; height:3px; border-radius:3px 3px 0 0; }
.date-switcher button.active { color:#fff; }
.date-switcher button.active::after { background:var(--green); }
.date-switcher span,.date-switcher strong { display:block; }
.date-switcher span { font-size:11px; font-weight:700; }
.date-switcher strong { margin-top:4px; font-size:10px; font-weight:500; color:#777; }
.date-switcher .active strong { color:#aaa; }
.day-arrow,.calendar-button { width:38px; height:38px; flex:none; display:grid; place-items:center; color:#aab7c9; background:#17263a; border:1px solid #2b3e56; border-radius:50%; cursor:pointer; }
.day-arrow { padding:0 0 3px; font-size:26px; line-height:1; }
.day-arrow:hover,.calendar-button:hover { color:#fff; background:#2b2b2b; }
.calendar-button { position:relative; border-radius:9px; }
.calendar-button svg { width:17px; fill:none; stroke:currentColor; stroke-width:1.8; }
.calendar-button input { position:absolute; inset:0; opacity:0; cursor:pointer; }
.page-shell { width:min(1050px,calc(100% - 32px)); margin:28px auto 80px; display:grid; grid-template-columns:220px minmax(0,760px); align-items:start; gap:22px; }
.match-page:not(.news-view) { width:min(1320px,calc(100% - 32px)); grid-template-columns:220px minmax(0,1fr) 280px; gap:18px; }
.match-page .feed-column { min-width:0; }
.news-sidebar { min-width:0; padding:20px 16px 0; overflow:hidden; background:var(--panel); border:1px solid var(--line); border-radius:16px; }
.news-sidebar>h2 { margin:0 0 20px; font-size:16px; }
.sidebar-news-list { color:var(--muted); font-size:12px; line-height:1.5; }
.sidebar-news-item { display:grid; grid-template-columns:72px minmax(0,1fr); align-items:start; gap:10px; padding:16px 0; color:var(--text); text-decoration:none; border-bottom:1px solid var(--line); }
.sidebar-news-item:first-child { display:block; padding-top:0; }
.sidebar-news-photo { width:72px; height:72px; display:grid; place-items:center; overflow:hidden; border-radius:12px; background:#1c2c40; color:var(--muted); font-size:11px; }
.sidebar-news-photo img { width:100%; height:100%; object-fit:cover; }
.sidebar-news-item:first-child .sidebar-news-photo { width:100%; height:auto; aspect-ratio:1.7; margin-bottom:14px; }
.sidebar-news-body { min-width:0; }
.sidebar-news-body h3 { margin:0; font-size:13px; line-height:1.45; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.sidebar-news-body p { margin:6px 0 0; color:var(--muted); font-size:11px; }
.sidebar-news-item:hover h3 { color:#ffad86; }
.sidebar-news-item:focus-visible,.sidebar-news-more:focus-visible { outline:2px solid var(--green); outline-offset:3px; }
.sidebar-news-more { display:block; padding:16px 0; text-align:center; color:var(--text); text-decoration:none; font-size:13px; font-weight:600; }
.sidebar-news-more:hover { color:var(--green); }
.sidebar-news-retry { display:block; margin-top:10px; padding:6px 12px; background:transparent; border:1px solid var(--line); border-radius:6px; cursor:pointer; }
.news-view .news-sidebar { display:none; }
@media (min-width:801px) and (max-width:1100px) {
  .match-page:not(.news-view) { grid-template-columns:170px minmax(0,1fr) 240px; gap:12px; }
  .news-sidebar { padding:16px 12px 0; }
}
@media (max-width:800px) {
  .match-page:not(.news-view) { width:min(760px,calc(100% - 16px)); display:block; }
  .news-sidebar { margin-top:24px; }
}
.side-panel { position:sticky; top:164px; max-height:calc(100vh - 180px); overflow-y:auto; padding:14px 10px; background:var(--panel); border:1px solid var(--line); border-radius:10px; scrollbar-width:thin; }
.side-label { margin:7px 10px 9px; color:#707070; font-size:9px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; }
.side-item { width:100%; height:40px; padding:0 11px; display:flex; align-items:center; gap:11px; color:#aaa; background:none; border:0; border-radius:7px; font-size:12px; text-align:left; cursor:pointer; }
.side-item span { width:18px; text-align:center; }
.side-item i { font-style:normal; }
.side-item:hover { color:#fff; background:#18283d; } .side-item.active { color:#fff; background:#203149; font-weight:700; }
.side-note { cursor:default; opacity:.55; }
.side-divider { height:1px; margin:12px 5px; background:var(--line); }
.football-categories[hidden] { display:none; }
.category-heading { min-height:32px; padding:0 10px; display:flex; align-items:center; justify-content:space-between; color:#eee; font-size:11px; }
.category-heading button { padding:3px 6px; color:var(--green); background:none; border:0; font-size:9px; cursor:pointer; }
.category-heading small { color:#6f8198; font-size:9px; }
.competition-list,.country-list { display:grid; gap:2px; }
.competition-item,.country-all { width:100%; min-height:34px; display:grid; grid-template-columns:20px minmax(0,1fr) auto; align-items:center; gap:7px; padding:5px 9px; color:#aab5c5; background:none; border:0; border-radius:7px; text-align:left; cursor:pointer; }
.competition-item:hover,.competition-item.active,.country-all:hover,.country-all.active { color:#fff; background:#203149; }
.competition-item i { overflow:hidden; font-style:normal; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.competition-item small { color:#667992; font-size:8px; }
.country-group { border-radius:7px; }
.country-group summary { min-height:36px; display:grid; grid-template-columns:21px minmax(0,1fr) auto; align-items:center; gap:8px; padding:4px 9px; color:#d3dae5; border-radius:7px; cursor:pointer; list-style:none; }
.country-group summary:hover { background:#18283d; }
.country-group summary::-webkit-details-marker { display:none; }
.country-group summary img { width:18px; height:18px; object-fit:cover; border-radius:50%; }
.country-group summary strong { font-size:10px; }
.country-group summary small { color:#667992; font-size:8px; }
.country-group[open] { padding-bottom:4px; background:rgba(255,255,255,.018); }
.country-group .competition-item,.country-all { padding-left:16px; }
.country-all { grid-template-columns:1fr; color:#7f90a7; font-size:9px; }
.category-error { padding:8px 10px; color:#d68d69; }
.feed-heading { min-height:62px; margin-bottom:12px; display:flex; align-items:flex-end; justify-content:space-between; }
.feed-heading p { margin:0 0 4px; color:var(--green); font-size:9px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; }
.feed-heading h1 { margin:0; font-size:23px; letter-spacing:-.8px; }
.feed-heading>span { padding-bottom:3px; color:#777; font-size:10px; }
.match-list { display:grid; gap:12px; }
.esports-game-item i { white-space:normal; overflow-wrap:anywhere; line-height:1.5; }
.esports-game-item { padding-top:9px; padding-bottom:9px; }
.esports-game-item>span { display:grid; place-items:center; width:20px; height:20px; border-radius:6px; background:transparent; }
.esports-game-item>span img { width:15px; height:15px; object-fit:contain; }
.esports-game-group { display:grid; gap:12px; min-width:0; }
.esports-game-group + .esports-game-group { margin-top:18px; }
.esports-game-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px 16px; padding:14px 16px; border-left:4px solid var(--green); border-radius:0 10px 10px 0; background:linear-gradient(90deg,rgba(255,122,69,.12),rgba(86,59,143,.08)); }
.esports-game-heading h2 { margin:0; color:var(--text); font-size:23px; line-height:1.4; font-weight:800; overflow-wrap:anywhere; }
.esports-game-heading>span { color:var(--muted); font-size:11px; }
@media(max-width:600px) { .esports-game-heading { padding:12px; } .esports-game-heading h2 { font-size:19px; } }
.league-card { overflow:hidden; background:var(--panel); border:1px solid var(--line); border-radius:10px; }
.league-header { height:53px; padding:0 15px; display:flex; align-items:center; border-bottom:1px solid var(--line); background:#152337; }
.league-icon { width:29px; height:29px; margin-right:10px; display:grid; place-items:center; background:#292929; border-radius:50%; font-size:12px; }
.league-icon img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
.league-icon[data-sport="esports"] img { width:19px; height:19px; object-fit:contain; border-radius:0; }
.crest.game-fallback { background:transparent !important; }
.crest.game-fallback img { width:72%; height:72%; object-fit:contain; }
.league-region { display:block; color:#777; font-size:7px; font-weight:800; letter-spacing:1px; }
.league-header h2,.league-header h3 { margin:2px 0 0; font-size:12px; }
.match-count { margin-left:auto; color:#777; font-size:9px; }
.league-collapse { width:28px; height:28px; margin-left:5px; color:#8290a2; background:none; border:0; border-radius:50%; cursor:pointer; }
.league-collapse:hover { color:#fff; background:rgba(255,255,255,.07); }
.match-row { min-height:72px; display:grid; grid-template-columns:minmax(0,1fr) 108px minmax(0,1fr) 30px; align-items:center; padding:9px 13px; border-bottom:1px solid #26364a; }
.match-row:last-child { border-bottom:0; }
.match-row { cursor:pointer; transition:background .15s; }
.match-row:hover,.match-row:focus-visible { background:#17263a; outline:none; }
.team { min-width:0; display:flex; align-items:center; gap:10px; }
.team.home { justify-content:flex-end; text-align:right; }
.team b { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:600; }
.news-load-more { display:block; margin:16px auto; background:transparent; cursor:pointer; }
.news-load-more:disabled { opacity:.5; cursor:wait; }
.news-list-card { display:flex; align-items:center; gap:18px; padding:16px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
.news-list-photo { width:152px; height:104px; flex:none; display:grid; place-items:center; overflow:hidden; background:#1c2c40; border-radius:9px; color:var(--muted); text-decoration:none; font-size:12px; }
.news-list-photo img { display:block; width:100%; height:100%; object-fit:cover; }
.news-list-card:first-child .news-list-photo { width:220px; height:148px; }
.news-list-body { flex:1; min-width:0; }
.news-list-body h3 { margin:0 0 9px; font-size:16px; line-height:1.5; }
.news-list-body h3 a { color:var(--text); text-decoration:none; }
.news-list-body h3 a:hover { color:#ffad86; }
.news-list-meta { display:flex; flex-wrap:wrap; gap:6px 12px; color:var(--muted); font-size:11px; }
.news-list-meta span { color:#ffad86; }
.news-list-body p { margin:9px 0 0; color:var(--muted); font-size:12px; line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media(max-width:600px) { .news-list-card { gap:12px; padding:12px; align-items:flex-start; } .news-list-photo,.news-list-card:first-child .news-list-photo { width:96px; height:82px; } .news-list-body h3 { font-size:14px; } .news-list-body p { display:none; } }
.crest { width:28px; height:28px; flex:none; display:grid; place-items:center; overflow:visible; color:#fff; background:transparent !important; border-radius:0; font-size:9px; font-weight:800; }
.crest img { width:100%; height:100%; display:block; padding:0; object-fit:contain; object-position:center; background:transparent; }
.crest.placeholder { border:1px solid rgba(255,255,255,.22); box-shadow:inset 0 0 0 2px rgba(0,0,0,.12); }
.crest.country-flag { background:transparent !important; border:0; box-shadow:none; }
.crest.country-flag img { width:100%; height:100%; padding:0; background:transparent; object-fit:contain; }
.crest.generated-badge { overflow:visible; background:transparent !important; border:0; box-shadow:none; border-radius:0; }
.crest.generated-badge img { width:100%; height:100%; padding:0; background:transparent; object-fit:contain; }
.match-centre { text-align:center; }
.match-centre>span { display:block; min-height:14px; margin-bottom:4px; color:#8a8a8a; font-size:9px; font-weight:700; }
.match-centre>span.live { width:max-content; margin:0 auto 4px; padding:2px 6px; color:var(--live); background:rgba(53,242,154,.1); border-radius:999px; text-shadow:0 0 14px rgba(53,242,154,.24); } .match-centre>span.paused { color:#e7ae55; }
.match-centre>span.finished { width:max-content; margin:0 auto 4px; padding:2px 6px; color:#aab3bf; background:#243246; border-radius:999px; }
.match-centre strong { display:flex; justify-content:center; align-items:center; gap:8px; font-size:18px; }
.match-centre strong em { min-width:16px; font-style:normal; } .match-centre strong i { color:#666; font-size:12px; font-style:normal; }
.match-centre small { display:block; margin-top:3px; color:#777; font-size:9px; }
.match-row.is-live .match-centre strong { color:var(--live); }
.favorite { color:#666; background:none; border:0; font-size:19px; cursor:pointer; }
.favorite:hover,.favorite.active { color:var(--green); }
.state { padding:58px 20px; text-align:center; color:#888; background:var(--panel); border:1px dashed var(--line); border-radius:10px; font-size:12px; }
.score-nav[hidden],.side-panel[hidden] { display:none; }
.page-shell.news-view { width:min(1050px,calc(100% - 32px)); grid-template-columns:minmax(0,1fr); }
.news-feed-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.news-feature-layout { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr); gap:20px; padding-bottom:22px; border-bottom:1px solid #26364b; }
.lead-news-card .news-feed-image { height:400px; }
.lead-news-card .news-feed-body h2 { font-size:24px; line-height:1.35; }
.lead-news-card .news-feed-body p { min-height:auto; font-size:12px; }
.trending-news { padding:4px 0; }
.trending-news>h2 { margin:0 0 8px; color:#f4f7fb; font-size:15px; }
.trending-item { min-height:92px; display:grid; grid-template-columns:24px minmax(0,1fr) 86px; align-items:center; gap:10px; padding:11px 0; color:#fff; border-bottom:1px solid #26364b; text-decoration:none; }
.trending-item>b { width:21px; height:21px; display:grid; place-items:center; color:#071422; background:#52e875; border-radius:50%; font-size:10px; }
.trending-item span { min-width:0; }
.trending-item strong,.trending-item small { display:block; }
.trending-item strong { font-size:12px; line-height:1.42; }
.trending-item small { margin-top:6px; color:#8190a4; font-size:9px; }
.trending-item img { width:86px; height:62px; object-fit:cover; border-radius:7px; }
.trending-item:hover strong { color:#ff9d70; }
.latest-news-heading { margin:24px 0 12px; font-size:17px; }
.news-feed-card { min-width:0; overflow:hidden; background:linear-gradient(145deg,#142238,#101b2b); border:1px solid #293b53; border-radius:14px; transition:transform .18s,border-color .18s,box-shadow .18s; }
.news-feed-card:hover { transform:translateY(-2px); border-color:#49617e; box-shadow:0 15px 38px rgba(0,0,0,.2); }
.news-feed-image { height:270px; display:block; overflow:hidden; background-color:#192a40; background-position:center 18%; background-size:cover; background-repeat:no-repeat; }
.news-feed-image img { width:100%; height:100%; display:block; object-fit:cover; object-position:center 18%; image-rendering:auto; transition:transform .3s; }
.news-feed-card:hover .news-feed-image img { transform:scale(1.025); }
.news-image-placeholder { display:grid; place-items:center; color:#ff9d70; background:radial-gradient(circle at 30% 30%,#2c4665,#101a29); font-size:24px; font-weight:900; }
.news-feed-body { padding:17px 18px 19px; }
.news-feed-meta { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.news-feed-meta span { padding:3px 7px; color:#ffad87; background:rgba(255,122,69,.1); border-radius:999px; font-size:9px; font-weight:800; }
.news-feed-meta time { color:#718299; font-size:9px; }
.news-feed-body h2 { margin:11px 0 8px; font-size:16px; line-height:1.42; }
.news-feed-body h2 a { color:#f4f7fb; text-decoration:none; }
.news-feed-body h2 a:hover { color:#ffad87; }
.news-feed-body p { min-height:52px; margin:0; display:-webkit-box; overflow:hidden; color:#93a2b7; font-size:11px; line-height:1.58; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.news-read-more { display:inline-block; margin-top:14px; color:#ff9162; font-size:10px; font-weight:800; text-decoration:none; }
.empty-state span,.empty-state strong,.empty-state small { display:block; }
.empty-state span { margin-bottom:10px; font-size:26px; }
.empty-state strong { color:#ddd; font-size:15px; }
.empty-state small { margin-top:6px; color:#777; }
.spinner { width:23px; height:23px; margin:0 auto 12px; border:2px solid #333; border-top-color:var(--green); border-radius:50%; animation:spin .7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
@media (max-width:800px) {
  .main-nav,.side-panel,.search-box kbd { display:none; }
  .header-inner { width:calc(100% - 24px); gap:12px; } .header-search { width:auto; flex:1; } .live-indicator { display:none; }
  .page-shell { width:min(100% - 16px,760px); display:block; margin-top:18px; } .score-nav { top:64px; }
  .date-switcher button { min-width:0; padding-inline:5px; } .feed-heading { padding:0 5px; }
  .match-row { grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr) 24px; padding-inline:9px; }
  .team { gap:6px; } .team b { max-width:105px; font-size:11px; } .crest { width:24px; height:24px; }
}
@media (max-width:800px) { .news-feature-layout { grid-template-columns:1fr; } }
@media (max-width:620px) { .news-feed-grid { grid-template-columns:1fr; } .news-feed-image { height:240px; } .lead-news-card .news-feed-image { height:300px; } .lead-news-card .news-feed-body h2 { font-size:19px; } .trending-item { grid-template-columns:24px minmax(0,1fr) 68px; } .trending-item img { width:68px; height:52px; } }
@media (max-width:480px) {
  .brand>span:last-child { display:none; } .day-arrow { width:32px; height:32px; } .calendar-button { width:34px; height:34px; }
  .match-row { grid-template-columns:minmax(0,1fr) 68px minmax(0,1fr) 18px; } .favorite { padding:0; }
}

.competition-card .league-mark { background:#192b41; border:1px solid var(--line); padding:5px; }
.competition-card>div:nth-child(2) { min-width:0; }
.competition-card h2 { overflow-wrap:anywhere; }

/* Player photos retain the initials fallback until successfully loaded. */
.transfer-avatar { position:relative; overflow:hidden; }
.transfer-row .transfer-avatar>span { margin:0; color:#291108; font-size:12px; font-weight:900; }
.transfer-avatar img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center top; opacity:0; }
.transfer-avatar.has-photo { background:#e6edf5; }
.transfer-avatar.has-photo img { opacity:1; }
.transfer-avatar.has-photo>span { visibility:hidden; }

/* Platform modules */
.platform-shell,.detail-shell { width:min(1040px,calc(100% - 32px)); margin:48px auto 90px; }
.platform-hero { display:flex; justify-content:space-between; align-items:flex-end; min-height:100px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.platform-hero p,.detail-league { margin:0 0 8px; color:var(--green); font-size:10px; font-weight:800; letter-spacing:1.6px; text-transform:uppercase; }
.platform-hero h1 { margin:0; font-size:36px; letter-spacing:-1.5px; }
.platform-hero>div>span { display:block; margin-top:9px; color:var(--muted); font-size:12px; }
.outline-action { padding:10px 14px; color:#ffac84; border:1px solid #6b412f; border-radius:8px; text-decoration:none; font-size:11px; font-weight:700; }
.platform-content { margin-top:24px; }
.platform-empty { min-height:330px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:linear-gradient(145deg,#111d2e,#0d1827); border:1px solid var(--line); border-radius:14px; }
.platform-empty>span { color:var(--green); font-size:34px; }.platform-empty h2 { margin:15px 0 7px; font-size:18px; }.platform-empty p { max-width:420px; margin:0; color:var(--muted); font-size:12px; line-height:1.7; }.platform-empty a { margin-top:20px; color:var(--green); font-size:11px; font-weight:700; text-decoration:none; }
.league-grid,.news-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.competition-card { min-height:120px; padding:20px; display:grid; grid-template-columns:48px 1fr auto; align-items:center; gap:15px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
.competition-mark,.player-avatar { width:48px; height:48px; display:grid; place-items:center; color:#291108; background:linear-gradient(135deg,#ffad86,var(--green)); border-radius:14px; font-size:12px; font-weight:900; }
.competition-mark img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 5px 8px rgba(0,0,0,.2)); }
.competition-card span { color:#718198; font-size:8px; font-weight:800; letter-spacing:1px; }.competition-card h2 { margin:5px 0; font-size:14px; }.competition-card p { margin:0; color:var(--muted); font-size:10px; }.competition-card a { color:var(--green); text-decoration:none; font-size:10px; font-weight:700; }
.transfer-list { overflow:hidden; border:1px solid var(--line); border-radius:12px; }.transfer-row { min-height:82px; padding:15px 18px; display:grid; grid-template-columns:45px 1fr 2fr 120px; gap:15px; align-items:center; background:var(--panel); border-bottom:1px solid var(--line); }.transfer-row:last-child { border-bottom:0; }.transfer-row .player-avatar { width:42px; height:42px; }.transfer-row strong,.transfer-row span,.transfer-fee small { display:block; }.transfer-row span,.transfer-fee small { margin-top:4px; color:var(--muted); font-size:9px; }.transfer-route { display:flex; gap:12px; align-items:center; font-size:11px; }.transfer-route i { color:var(--green); font-style:normal; }.transfer-fee { text-align:right; font-size:11px; font-weight:700; }
.news-card { min-height:420px; overflow:hidden; color:inherit; background:var(--panel); border:1px solid var(--line); border-radius:12px; text-decoration:none; }.news-art { height:270px; background-color:#18283d; background-position:center 18%; background-size:cover; background-repeat:no-repeat; }.news-card>div:last-child { padding:17px; }.news-card span,.news-card time { color:var(--green); font-size:9px; font-weight:700; }.news-card h2 { margin:8px 0; font-size:16px; line-height:1.4; }.news-card p { color:var(--muted); font-size:11px; line-height:1.6; }.news-card time { color:#718198; }
.saved-card { padding:25px; display:flex; align-items:center; gap:18px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }.saved-card>span { color:var(--green); font-size:30px; }.saved-card h2 { margin:0 0 5px; font-size:16px; }.saved-card p { margin:0; color:var(--muted); font-size:11px; }.saved-card a { margin-left:auto; color:var(--green); text-decoration:none; font-size:11px; font-weight:700; }
.search-results { position:relative; z-index:5; margin-top:12px; padding:8px; background:#152337; border:1px solid var(--line); border-radius:10px; box-shadow:0 20px 45px rgba(0,0,0,.3); }.search-results a { padding:10px; display:flex; justify-content:space-between; color:#fff; text-decoration:none; border-radius:7px; font-size:11px; }.search-results a:hover { background:#203149; }.search-results span,.search-results p { color:var(--muted); font-size:9px; }
.detail-shell { max-width:850px; }.detail-league { text-align:center; }.scoreboard { min-height:230px; padding:35px; display:grid; grid-template-columns:1fr 180px 1fr; align-items:center; background:linear-gradient(145deg,#15243a,#0d1827); border:1px solid var(--line); border-radius:15px; }.detail-team { text-align:center; }.detail-team img { width:72px; height:72px; object-fit:contain; }.detail-team h2 { font-size:16px; }.detail-score { text-align:center; }.detail-score span,.detail-score small { display:block; color:var(--muted); font-size:10px; }.detail-score strong { display:block; margin:12px 0; font-size:36px; }.detail-score i { color:#63738a; font-style:normal; }.detail-tabs { display:flex; justify-content:center; margin:16px 0; background:var(--panel); border:1px solid var(--line); border-radius:10px; }.detail-tabs button { padding:14px 20px; color:var(--muted); background:none; border:0; border-bottom:2px solid transparent; }.detail-tabs button.active { color:#fff; border-color:var(--green); }.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.info-panel { padding:20px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }.info-panel h3 { margin:0 0 16px; font-size:13px; }.info-panel dl { margin:0; }.info-panel dl div { padding:10px 0; display:flex; justify-content:space-between; border-bottom:1px solid var(--line); }.info-panel dt,.info-panel dd,.empty-compact { margin:0; color:var(--muted); font-size:10px; line-height:1.7; }.info-panel dd { color:#fff; }
@media(max-width:700px){.platform-shell,.detail-shell{width:calc(100% - 18px);margin-top:25px}.platform-hero h1{font-size:28px}.league-grid,.news-grid,.detail-grid{grid-template-columns:1fr}.scoreboard{grid-template-columns:1fr 100px 1fr;padding:25px 10px}.detail-team img{width:48px;height:48px}.detail-team h2{font-size:12px}.detail-score strong{font-size:25px}.detail-tabs{overflow:auto;justify-content:flex-start}.detail-tabs button{padding-inline:15px}.transfer-row{grid-template-columns:40px 1fr 90px}.transfer-route{display:none}}