@charset "UTF-8";
:root {
  --navy: #102b42;
  --ink: #172d40;
  --muted: #7a8998;
  --green: #009e73;
  --green-dark: #00855f;
  --line: #e6ebf0;
  --canvas: #f3f5f8;
  --red: #dc4b56;
  --radius: 7px;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 24px;
}
body {
  margin: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family:
    "Pretendard", "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.65;
  letter-spacing: -0.35px;
}
a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  color: var(--green);
}
button,
input,
select,
textarea {
  font: inherit;
  letter-spacing: inherit;
}
button,
a,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}
button {
  border: 0;
  background: none;
  color: inherit;
}
input,
select,
textarea {
  border: 1px solid #dbe3eb;
  border-radius: 4px;
  background: #fff;
  color: var(--ink);
  padding: 10px 12px;
  min-width: 0;
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--green);
  outline: 3px solid #009e731c;
}
a:focus-visible,
button:focus-visible {
  outline: 3px solid #00bc8b;
  outline-offset: 3px;
}
h1,
h2,
h3,
p {
  margin: 0;
}
h1 {
  font-size: 23px;
  line-height: 1.45;
  letter-spacing: -1px;
}
h2 {
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: -0.45px;
}
h3 {
  font-size: 14px;
}
small {
  font-size: 11px;
}
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
table {
  border-collapse: collapse;
  width: 100%;
}
.green {
  color: var(--green);
}
.muted,
.subtle {
  color: var(--muted);
}
.subtle {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: -0.2px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.skip-link {
  position: fixed;
  top: -100px;
  left: 20px;
  background: #fff;
  padding: 12px;
  z-index: 100;
}
.skip-link:focus {
  top: 10px;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  background: #fff;
  border: 1px solid #dce4eb;
  border-radius: 4px;
  min-height: 33px;
  padding: 6px 13px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  transition:
    background 0.15s,
    color 0.15s;
}
.button:hover {
  background: #f2f7f5;
  border-color: #afd8c9;
}
.button.primary {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}
.button.primary:hover {
  background: var(--green-dark);
}
.button.small {
  min-height: 29px;
  padding: 4px 11px;
  font-size: 11px;
}
.text-button {
  padding: 0;
  font-size: 12px;
}
.dot {
  width: 6px;
  height: 6px;
  background: var(--green);
  display: inline-block;
  border-radius: 50%;
  margin-right: 6px;
  flex-shrink: 0;
}
.dot.red {
  background: var(--red);
}
.dot.gray {
  background: #9aa7b4;
}
.header {
  background: var(--navy);
  color: #fff;
}
.header-inner {
  max-width: 1520px;
  margin: auto;
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 34px;
  padding: 0 24px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 163px;
  color: #fff;
  font-size: 25px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: -1.4px;
}
.brand:hover {
  color: #fff;
}
.brand .green {
  color: #1dc492;
}
.brand small {
  display: block;
  font-size: 9px;
  font-weight: 400;
  color: #92aabb;
  letter-spacing: 1.1px;
  margin-top: 5px;
}
.brand-mark {
  width: 28px;
  height: 32px;
  color: #1bc191;
}
.top-nav {
  display: flex;
  gap: 27px;
  align-self: stretch;
  align-items: center;
  white-space: nowrap;
}
.top-nav a {
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  font-size: 14px;
  font-weight: 700;
  color: #d8e2ea;
}
.top-nav a:hover,
.top-nav a.active {
  color: #fff;
}
.top-nav a.active:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: #1fc494;
}
.header-search {
  margin-left: auto;
  display: flex;
  align-items: center;
  background: #ffffff09;
  border: 1px solid #ffffff20;
  border-radius: 5px;
  width: 245px;
  height: 35px;
}
.header-search input {
  width: 100%;
  color: #fff;
  background: none;
  border: 0;
  font-size: 11px;
  padding: 7px 10px;
}
.header-search input::placeholder {
  color: #a3b4c4;
}
.header-search button {
  font-size: 25px;
  padding: 0 10px;
  color: #bdcbd7;
}
.account-nav {
  display: flex;
  gap: 15px;
  align-items: center;
  white-space: nowrap;
  font-size: 11px;
}
.account-nav form {
  display: flex;
}
.member-name {
  font-weight: 600;
  max-width: 95px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.member-name span {
  font-weight: 400;
  color: #a4b9c8;
  margin-left: 3px;
}
.utility-strip {
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.utility-strip > div {
  max-width: 1520px;
  margin: auto;
  padding: 8px 24px;
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  color: #647b8e;
}
.utility-strip .dot {
  width: 5px;
  height: 5px;
}
.site-grid {
  max-width: 1520px;
  padding: 22px 24px 35px;
  margin: auto;
  display: grid;
  grid-template-columns: 174px minmax(0, 1fr) 304px;
  gap: 18px;
  align-items: start;
}
.left-sidebar {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.side-section {
  padding: 13px 0 12px;
  border-bottom: 1px solid var(--line);
}
.side-section h2 {
  padding: 4px 16px 10px;
  font-size: 13px;
}
.side-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  font-size: 12px;
  position: relative;
  color: #526578;
}
.side-link:hover {
  background: #f7faf9;
}
.side-link.selected {
  background: #e8f6f0;
  color: #008b64;
  font-weight: 700;
}
.side-link.selected:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--green);
}
.sport-icon {
  width: 19px;
  font-size: 16px;
}
.nav-icon {
  display: inline-block;
  width: 19px;
  font-size: 17px;
  vertical-align: middle;
}
.league-initial {
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  font-size: 8px;
  letter-spacing: -0.5px;
  font-weight: 800;
  background: #edf2f6;
  color: #536d81;
  border-radius: 4px;
}
.sidebar-note {
  display: block;
  margin: 15px 10px 10px;
  padding: 15px 12px 0;
  background: var(--navy);
  color: #fff;
  border-radius: 4px;
  overflow: hidden;
}
.sidebar-note:hover {
  color: #fff;
}
.tiny-label {
  font-size: 7px;
  letter-spacing: 1.3px;
  color: #6dbfa7;
}
.sidebar-note strong {
  display: block;
  font-size: 16px;
  line-height: 1.5;
  margin: 8px 0 14px;
  letter-spacing: -0.6px;
}
.sidebar-note > span:last-of-type {
  font-size: 9px;
  color: #bacbd8;
}
.sidebar-note svg {
  width: 100%;
  color: #28bc96;
  opacity: 0.5;
  margin-top: 12px;
}
.main-content,
.right-sidebar {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 17px;
  border-bottom: 1px solid var(--line);
}
.panel-heading > a:not(.button) {
  font-size: 10px;
  color: #8a99a7;
}
.panel-heading h2 > .subtle {
  margin-left: 8px;
}
.section-body {
  padding: 20px;
}
.announcement {
  border: 1px solid var(--line);
  background: #fff;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 13px;
  border-radius: 5px;
  font-size: 11px;
}
.announcement-label {
  font-weight: 800;
  color: var(--green);
  font-size: 10px;
  padding-right: 10px;
  border-right: 1px solid var(--line);
}
.announcement > a:nth-child(2) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.announcement-more {
  margin-left: auto;
  color: #8b9aa7;
  font-size: 10px;
  white-space: nowrap;
}
.demo-notice {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  color: #718190;
  padding: 0 3px;
  margin-top: -6px;
}
.demo-notice > span {
  font-size: 8px;
  font-weight: 800;
  border: 1px solid #d7e1e9;
  padding: 1px 4px;
  border-radius: 3px;
  color: #7d8e9b;
}
.breadcrumb {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 11px;
  color: #93a0ac;
  padding: 0 2px;
  flex-wrap: wrap;
}
.breadcrumb a {
  color: #6b7d8c;
}
.breadcrumb > span:last-child {
  max-width: 70%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.page-heading {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 21px 18px 17px;
}
.page-heading p {
  font-size: 11px;
  color: #8b99a7;
  margin-top: 5px;
  line-height: 1.8;
}
.live-badge {
  display: inline-flex;
  align-items: center;
  color: var(--red);
  background: #fff1f2;
  border-radius: 3px;
  padding: 3px 7px;
  font-size: 9px;
  letter-spacing: 0;
  margin-left: 7px;
  vertical-align: middle;
}
.live-badge .dot {
  width: 4px;
  height: 4px;
  margin-right: 4px;
}
.date-picker {
  display: flex;
  align-items: center;
  white-space: nowrap;
  font-size: 11px;
  gap: 4px;
}
.date-picker > span {
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  padding: 5px 7px;
  border-radius: 4px;
}
.date-picker > a {
  display: grid;
  place-items: center;
  width: 22px;
  height: 30px;
  font-size: 18px;
  color: #8d9aa7;
}
.date-picker .today-button {
  font-size: 10px;
  width: 35px;
  border: 1px solid var(--line);
  border-radius: 4px;
}
.date-picker small {
  font-size: 9px;
  color: #8a99a6;
}
.sport-tabs {
  display: flex;
  margin: 0 17px;
  border-bottom: 1px solid var(--line);
  gap: 3px;
  overflow-x: auto;
  scrollbar-width: none;
}
.sport-tabs a {
  white-space: nowrap;
  padding: 9px 15px;
  color: #7d8c99;
  font-size: 11px;
  font-weight: 600;
  border-bottom: 2px solid transparent;
}
.sport-tabs a.active {
  color: var(--green);
  border-bottom-color: var(--green);
}
.status-filters {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 11px 17px;
}
.status-filters a {
  font-size: 10px;
  color: #83929f;
  padding: 2px 9px;
  border-radius: 3px;
}
.status-filters a.active {
  background: #eff5f3;
  color: #087b5b;
  font-weight: 700;
}
.status-filters > span {
  margin-left: auto;
  font-size: 9px;
  color: #a3adb6;
}
.fixture-list {
  padding: 0 16px 5px;
}
.fixture-head,
.fixture-row {
  display: grid;
  grid-template-columns: 91px minmax(0, 1fr) 65px 73px 81px;
  align-items: center;
  gap: 8px;
}
.fixture-head {
  background: #f6f8fa;
  font-size: 9px;
  color: #8c9aa6;
  padding: 7px 10px;
  text-align: center;
  border-top: 1px solid #edf1f4;
  border-bottom: 1px solid #edf1f4;
}
.fixture-head > span:first-child {
  text-align: left;
}
.fixture-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px;
  background: #f0f8f4;
  font-size: 10px;
  font-weight: 700;
  margin-top: 9px;
  color: #497866;
}
.fixture-group b {
  font-size: 9px;
  font-weight: 500;
  color: var(--green);
  margin-left: 3px;
}
.fixture-group small {
  font-size: 8px;
  color: #8b9e94;
  font-weight: 400;
}
.fixture-row {
  padding: 12px 10px;
  min-height: 60px;
  border-bottom: 1px solid #edf1f4;
  transition: background 0.15s;
}
.fixture-row:hover {
  background: #fafcfb;
}
.fixture-row:last-child {
  border-bottom: 0;
}
.fixture-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 10px;
}
.fixture-meta time {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: #577084;
}
.fixture-meta > a {
  color: #8c9aa6;
  font-size: 9px;
  max-width: 43px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fixture-teams {
  display: grid;
  grid-template-columns: 1fr 18px 1fr;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.team-mini {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  min-width: 0;
  font-size: 11px;
  font-weight: 600;
}
.team-mini > span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.team-mini.away {
  justify-content: flex-start;
  flex-direction: row-reverse;
}
.crest {
  --team: #123551;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 27px;
  flex-shrink: 0;
  color: var(--team);
  background: color-mix(in srgb, var(--team) 9%, white);
  border: 1px solid color-mix(in srgb, var(--team) 24%, white);
  border-radius: 4px 4px 9px 9px;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: -0.2px;
}
.team-mini:not(.away) .crest {
  order: 2;
}
.versus {
  text-align: center;
  font-size: 9px;
  color: #a7b3bd;
}
.fixture-score {
  text-align: center;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.8px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fixture-state {
  font-size: 10px;
  color: #98a3ae;
  text-align: center;
  white-space: nowrap;
}
.fixture-state.live {
  color: var(--red);
  font-size: 9px;
  font-weight: 600;
}
.fixture-action {
  font-size: 9px;
  min-height: 28px;
  padding: 4px 7px;
  border-color: #e1e8ed;
  color: #688092;
  background: #fafbfc;
}
.league-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 13px 17px;
  border-top: 1px solid var(--line);
  font-size: 10px;
}
.league-strip strong {
  margin-right: 4px;
}
.league-strip a {
  color: #788e9f;
  font-size: 10px;
}
.league-strip a > span {
  color: #a7b7c2;
  margin-left: 4px;
}
.compact-tabs {
  display: flex;
  gap: 18px;
  padding: 10px 17px 0;
  font-size: 10px;
  border-bottom: 1px solid var(--line);
}
.compact-tabs a {
  padding: 0 0 9px;
  color: #81919f;
}
.compact-tabs a.active {
  color: var(--green);
  border-bottom: 2px solid var(--green);
  font-weight: 700;
}
.push-right {
  margin-left: auto;
}
.board-scroll {
  padding: 0 16px 10px;
  overflow-x: auto;
}
.board-table {
  table-layout: fixed;
  font-size: 10px;
}
.board-table th {
  font-size: 9px;
  font-weight: 500;
  color: #8c9dab;
  padding: 10px 4px;
  border-bottom: 1px solid #e6ecf1;
  background: #fff;
}
.board-table td {
  padding: 10px 4px;
  border-bottom: 1px solid #edf1f4;
  text-align: center;
  color: #8192a1;
}
.board-table tr:last-child td {
  border: 0;
}
.board-table td.post-title {
  text-align: left;
  color: #344c60;
  font-size: 11px;
}
.post-title {
  width: auto;
  text-align: left;
}
.post-title > a {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.post-number {
  width: 48px;
  font-size: 9px;
}
.post-author {
  width: 73px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.post-date {
  width: 42px;
  font-variant-numeric: tabular-nums;
}
.post-views {
  width: 45px;
  font-variant-numeric: tabular-nums;
}
.post-votes {
  width: 35px;
}
.comment-count {
  color: var(--red);
  font-size: 9px;
  font-weight: 600;
}
.notice-tag {
  font-size: 8px;
  background: #e9f5ef;
  color: #139367;
  padding: 1px 4px;
  border-radius: 2px;
  margin-right: 4px;
}
.board-tabs {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  padding: 0 17px 14px;
  border-bottom: 1px solid var(--line);
}
.board-tabs a {
  font-size: 11px;
  padding: 5px 9px;
  border: 1px solid var(--line);
  border-radius: 3px;
  color: #6d8393;
}
.board-tabs a.active {
  background: #eaf7f0;
  color: var(--green);
  border-color: #cceadb;
}
.board-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 17px;
  font-size: 11px;
  color: #8d9aa5;
}
.pagination {
  display: flex;
  gap: 5px;
  justify-content: center;
  padding: 17px;
}
.pagination a {
  min-width: 29px;
  height: 29px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 4px;
  font-size: 11px;
}
.pagination a.active {
  color: #fff;
  background: var(--green);
  border-color: var(--green);
}
.board-search {
  display: flex;
  gap: 5px;
  justify-content: center;
  padding: 0 20px 20px;
}
.board-search input {
  padding: 6px 10px;
  font-size: 11px;
  max-width: 230px;
}
.search-form {
  display: flex;
  gap: 8px;
}
.search-form input {
  flex: 1;
}
.chat-panel {
  min-height: 565px;
  display: flex;
  flex-direction: column;
}
.chat-panel .panel-heading {
  padding: 15px;
}
.chat-symbol {
  font-size: 16px;
  margin-right: 4px;
}
.connection-indicator {
  font-size: 9px;
  color: #8598a7;
  display: flex;
  align-items: center;
}
.connection-indicator .dot {
  width: 5px;
  height: 5px;
}
.chat-tabs {
  display: flex;
  margin: 0 12px;
  padding-top: 10px;
}
.chat-tabs button {
  flex: 1;
  border: 1px solid var(--line);
  padding: 7px 4px;
  font-size: 10px;
  color: #8c9aa6;
  background: #f8fafb;
}
.chat-tabs button:first-child {
  border-radius: 4px 0 0 4px;
}
.chat-tabs button:last-child {
  border-radius: 0 4px 4px 0;
}
.chat-tabs button.active {
  background: #fff;
  color: #1f6d54;
  border-top: 2px solid var(--green);
  font-weight: 700;
  padding-top: 6px;
}
.chat-notice {
  padding: 10px 14px;
  font-size: 9px;
  color: #93a397;
}
.chat-notice > span {
  color: #28a47c;
  margin-right: 5px;
}
.chat-messages {
  padding: 4px 14px 12px;
  height: 368px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #d5e0e6 transparent;
}
.chat-message {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 0;
}
.chat-avatar {
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: #edf2f6;
  color: #678a9e;
  display: grid;
  place-items: center;
  font-size: 10px;
  flex-shrink: 0;
}
.chat-message:nth-child(3n + 2) .chat-avatar {
  background: #e7f3ed;
  color: #528875;
}
.chat-message:nth-child(3n) .chat-avatar {
  background: #f9eee6;
  color: #ae8468;
}
.chat-message-content {
  min-width: 0;
  flex: 1;
}
.chat-message-content > div {
  display: flex;
  gap: 8px;
  align-items: center;
}
.chat-message strong {
  font-size: 10px;
  color: #49677d;
}
.chat-message time {
  font-size: 8px;
  color: #a7b3bd;
}
.chat-message p {
  font-size: 11px;
  line-height: 1.7;
  margin-top: 2px;
  color: #61798b;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}
.chat-compose {
  display: flex;
  gap: 5px;
  padding: 11px 12px 0;
  border-top: 1px solid var(--line);
  margin-top: auto;
}
.chat-compose input {
  flex: 1;
  min-width: 0;
  font-size: 10px;
  padding: 8px;
}
.chat-compose .button {
  font-size: 10px;
  padding: 7px 11px;
}
.chat-feedback {
  text-align: center;
  font-size: 9px;
  min-height: 35px;
  padding: 8px 12px;
  color: #97a5b1;
}
.chat-feedback a {
  color: var(--green);
  text-decoration: underline;
}
.chat-empty {
  font-size: 11px;
  color: #93a4b0;
  text-align: center;
  padding-top: 40px;
}
.chat-room-picker {
  padding: 10px 12px;
}
.chat-room-picker label {
  display: block;
  font-size: 10px;
  color: #8b9daa;
  margin-bottom: 4px;
}
.chat-room-picker select {
  width: 100%;
  padding: 6px;
  font-size: 10px;
}
.side-notices ul {
  padding: 10px 15px;
}
.side-notices li {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 0;
  font-size: 10px;
}
.side-notices li a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #60798d;
}
.side-notices time {
  color: #a6b1bb;
  font-size: 9px;
}
.popular-posts ol {
  counter-reset: popular;
  padding: 9px 15px;
}
.popular-posts li {
  counter-increment: popular;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 0;
  font-size: 10px;
}
.popular-posts li:before {
  content: counter(popular);
  font-weight: 800;
  color: var(--green);
  font-size: 11px;
}
.popular-posts a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #61798d;
}
.popular-posts li > span {
  font-size: 8px;
  color: #a2b0ba;
  margin-left: auto;
}
.empty-state {
  text-align: center;
  padding: 42px 20px;
  color: #8396a5;
}
.empty-state > span {
  font-size: 28px;
  color: #c3d3dd;
  display: block;
  margin-bottom: 10px;
}
.empty-state strong {
  font-size: 13px;
  display: block;
  font-weight: 600;
}
.empty-state p {
  font-size: 11px;
  margin-top: 5px;
}
.empty-state.compact {
  padding: 27px 17px;
}
.article-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 17px;
  gap: 0;
}
.article-preview {
  padding: 2px 16px;
  border-right: 1px solid var(--line);
  min-width: 0;
}
.article-preview:first-child {
  padding-left: 0;
}
.article-preview:last-child {
  border: 0;
  padding-right: 0;
}
.article-category {
  font-size: 9px;
  color: var(--green);
  font-weight: 600;
  background: #eef8f3;
  border-radius: 3px;
  padding: 3px 6px;
  display: inline-block;
}
.article-preview h3 {
  margin: 9px 0 6px;
  line-height: 1.6;
  font-size: 13px;
  letter-spacing: -0.45px;
}
.article-preview p {
  font-size: 10px;
  line-height: 1.9;
  color: #96a4af;
}
.article-more {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
  font-size: 9px;
  color: #748d9e;
}
.article-more span {
  color: var(--green);
}
.page-blog .article-list {
  grid-template-columns: 1fr;
  gap: 20px;
  padding: 24px;
}
.page-blog .article-preview {
  border-right: 0;
  border-bottom: 1px solid var(--line);
  padding: 0 0 20px;
}
.page-blog .article-preview h3 {
  font-size: 17px;
}
.page-blog .article-preview p {
  font-size: 12px;
}
.page-blog .article-more {
  justify-content: flex-start;
  gap: 15px;
}
.article-detail .section-body {
  padding: 30px;
}
.article-detail h1,
.post-detail h1 {
  font-size: 24px;
  line-height: 1.55;
  margin: 12px 0 10px;
}
.article-lead {
  font-size: 13px;
  color: #8093a2;
  line-height: 1.9;
}
.post-byline {
  display: flex;
  gap: 13px;
  align-items: center;
  font-size: 10px;
  color: #98a5af;
  border-bottom: 1px solid var(--line);
  padding: 15px 0;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.post-byline strong {
  color: #567287;
}
.prose {
  font-size: 13px;
  line-height: 2;
  color: #566d80;
  overflow-wrap: anywhere;
}
.prose h2 {
  font-size: 17px;
  color: var(--ink);
  margin: 28px 0 12px;
}
.prose p {
  margin-bottom: 18px;
}
.plain-text {
  white-space: pre-wrap;
}
.related-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 25px 0 15px;
}
.related-tags a {
  font-size: 10px;
  background: #f1f6f8;
  padding: 6px 10px;
  border: 1px solid #e4edf2;
  border-radius: 4px;
  color: #4e7388;
}
.editorial-note {
  font-size: 10px;
  color: #8a9ca9;
  line-height: 1.8;
  padding: 14px;
  background: #f8fafb;
  border-left: 2px solid #c3d6df;
  margin-top: 25px;
}
.post-actions {
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 12px 0;
}
.comment {
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
.comment strong {
  font-size: 11px;
}
.comment time {
  font-size: 9px;
  color: #94a4b0;
  margin-left: 10px;
}
.comment p {
  font-size: 12px;
  color: #627c8f;
  margin-top: 7px;
}
.comment-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 20px;
}
.comment-form textarea {
  min-height: 85px;
  resize: vertical;
}
.comment-form button {
  align-self: flex-end;
}
.report-form {
  font-size: 10px;
  color: #899ba8;
  margin-top: 15px;
}
.report-form form {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}
.report-form input {
  flex: 1;
  padding: 7px 10px;
  font-size: 11px;
}
.section-tabs {
  display: flex;
  gap: 22px;
  padding: 13px 18px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 5px;
  font-size: 11px;
  color: #678297;
  overflow-x: auto;
  white-space: nowrap;
}
.league-description {
  padding: 18px;
  font-size: 12px;
  color: #7c91a2;
}
.league-description p {
  margin-top: 7px;
  line-height: 1.9;
}
.league-country {
  font-size: 9px;
  padding: 3px 6px;
  background: #f0f4f7;
  border-radius: 3px;
}
.team-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 18px;
}
.team-grid a {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 11px;
}
.team-profile {
  display: flex;
  gap: 18px;
  align-items: center;
  padding: 20px;
}
.team-profile strong {
  font-size: 17px;
}
.team-profile p {
  font-size: 11px;
  color: #8fa0ad;
  margin-top: 5px;
}
.team-standing {
  margin-left: auto;
  font-size: 11px;
}
.team-standing strong {
  display: block;
  font-size: 15px;
  color: var(--green);
}
.standing-table {
  font-size: 12px;
}
.standing-table th,
.standing-table td {
  padding: 12px;
  text-align: center;
  border-bottom: 1px solid var(--line);
}
.standing-table th {
  color: #8fa1ae;
  font-size: 10px;
  font-weight: 400;
}
.standing-table td:nth-child(2) {
  text-align: left;
}
.match-meta {
  display: flex;
  gap: 10px;
  padding: 16px 20px 0;
  align-items: center;
  font-size: 11px;
  color: #8c9fac;
}
.state-pill {
  margin-left: auto;
  font-size: 10px;
  color: var(--red);
  background: #fff1f2;
  padding: 3px 8px;
  border-radius: 3px;
}
.match-title {
  text-align: center;
  font-size: 16px;
  color: #4e687d;
  margin: 20px 15px 0;
}
.match-scoreboard {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
  text-align: center;
  padding: 24px 25px 27px;
  gap: 14px;
}
.match-scoreboard > a {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 8px;
}
.crest.big {
  width: 55px;
  height: 63px;
  font-size: 16px;
  border-radius: 9px 9px 20px 20px;
}
.match-scoreboard > a strong {
  font-size: 14px;
}
.match-scoreboard > a small {
  font-size: 8px;
  letter-spacing: 1px;
  color: #97a9b5;
}
.match-scoreboard > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.big-score {
  font-size: 40px;
  letter-spacing: 1px;
  line-height: 1.3;
  font-variant-numeric: tabular-nums;
}
.match-scoreboard > div > span {
  font-size: 11px;
  color: var(--red);
}
.match-scoreboard time {
  font-size: 10px;
  color: #97a9b5;
}
.match-location {
  border-top: 1px solid var(--line);
  font-size: 10px;
  color: #97a6b2;
  padding: 10px 18px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.broadcast-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #f7fafb;
  padding: 35px 15px;
  text-align: center;
  gap: 7px;
}
.screen-symbol {
  font-size: 30px;
  color: #b9cbd6;
}
.broadcast-empty strong {
  font-size: 14px;
  color: #6c8799;
}
.broadcast-empty p {
  font-size: 11px;
  color: #99aab6;
}
.quiet-label {
  font-size: 9px;
  color: #a7b4be;
  margin-top: 4px;
}
.stream-option {
  padding: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.stream-option p {
  font-size: 11px;
  color: #8a9caa;
  margin-top: 5px;
}
.stat-list {
  padding: 15px 24px;
}
.stat-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
  text-align: center;
  gap: 6px;
  padding: 12px 0;
  font-size: 13px;
}
.stat-row strong {
  font-size: 11px;
  color: #8c9eac;
  font-weight: 500;
}
.stat-bar {
  grid-column: 1/-1;
  height: 5px;
  background: #dce7ed;
  border-radius: 4px;
  overflow: hidden;
}
.stat-bar i {
  display: block;
  height: 100%;
  background: var(--green);
}
.footer {
  background: #fff;
  border-top: 1px solid var(--line);
  color: #98a8b3;
}
.footer > div {
  max-width: 1520px;
  margin: auto;
  padding: 19px 24px;
  display: flex;
  align-items: center;
  gap: 22px;
}
.footer-brand {
  font-size: 13px;
  font-weight: 800;
  color: #426277;
}
.footer-brand span {
  color: var(--green);
}
.footer nav {
  display: flex;
  gap: 16px;
  font-size: 9px;
}
.footer small {
  margin-left: auto;
  font-size: 8px;
}
.mobile-nav {
  display: none;
}
.flash {
  max-width: 900px;
  margin: 15px auto;
  background: #e8f6ef;
  padding: 12px 18px;
  color: #137a5b;
  border-radius: 4px;
}
.form-page {
  max-width: 560px;
  min-height: 65vh;
  margin: 45px auto;
  padding: 0 20px;
}
.form-page.wide {
  max-width: 900px;
}
.form-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 30px;
}
.form-card h1 {
  font-size: 25px;
}
.form-card .form-intro {
  font-size: 12px;
  color: #8c9da9;
  margin: 8px 0 25px;
}
.form-fields {
  display: flex;
  flex-direction: column;
  gap: 17px;
}
.form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.form-field label {
  font-size: 12px;
  font-weight: 600;
}
.form-field small {
  color: #92a2ae;
}
.form-field textarea {
  min-height: 220px;
  resize: vertical;
}
.form-field input,
.form-field select {
  width: 100%;
}
.form-fields > .button {
  margin-top: 6px;
  min-height: 42px;
}
.form-bottom {
  font-size: 11px;
  color: #8fa2af;
  text-align: center;
  margin-top: 20px;
}
.form-bottom a {
  color: var(--green);
  margin-left: 6px;
}
.validation-summary-errors,
.field-validation-error {
  font-size: 11px;
  color: var(--red);
  line-height: 1.8;
}
.validation-summary-errors {
  padding: 10px;
  background: #fff5f5;
  border-radius: 4px;
  margin: 12px 0;
}
.validation-summary-valid,
.field-validation-valid {
  display: none;
}
.admin-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 20px 0;
}
.admin-stat {
  padding: 15px;
  background: #f4f8f9;
  border-radius: 4px;
}
.admin-stat strong {
  font-size: 24px;
  display: block;
}
.admin-table {
  font-size: 11px;
}
.admin-table th,
.admin-table td {
  padding: 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}
.admin-table form {
  display: inline-flex;
  gap: 5px;
}
.admin-table input {
  padding: 4px;
  max-width: 80px;
}
.admin-toolbar {
  display: flex;
  gap: 8px;
  margin: 20px 0;
  flex-wrap: wrap;
}
@media (min-width: 1600px) {
  .site-grid {
    padding-top: 26px;
  }
  .fixture-row {
    min-height: 64px;
  }
  .chat-messages {
    height: 408px;
  }
  .chat-panel {
    min-height: 605px;
  }
}
@media (max-width: 1280px) {
  .header-inner {
    gap: 20px;
  }
  .top-nav {
    gap: 20px;
  }
  .header-search {
    width: 190px;
  }
  .site-grid {
    grid-template-columns: 150px minmax(0, 1fr) 270px;
    gap: 13px;
    padding: 18px;
  }
  .header-inner {
    padding: 0 18px;
  }
  .brand {
    min-width: 140px;
    font-size: 22px;
  }
  .fixture-head,
  .fixture-row {
    grid-template-columns: 70px minmax(0, 1fr) 54px 61px 68px;
    gap: 5px;
  }
  .fixture-meta {
    gap: 6px;
  }
  .fixture-list {
    padding: 0 11px 5px;
  }
  .fixture-row {
    padding: 12px 5px;
  }
  .team-mini {
    font-size: 10px;
    gap: 4px;
  }
  .crest {
    width: 20px;
    height: 24px;
    font-size: 6px;
  }
  .fixture-score {
    font-size: 13px;
  }
  .sport-tabs a {
    padding: 9px 10px;
  }
  .date-picker {
    font-size: 10px;
  }
  .page-heading {
    padding: 18px 15px;
  }
  .page-heading h1 {
    font-size: 21px;
  }
  .side-link {
    padding: 8px 12px;
  }
  .post-number {
    width: 41px;
  }
  .post-author {
    width: 58px;
  }
  .post-votes {
    width: 28px;
  }
  .article-preview {
    padding: 0 10px;
  }
}
@media (max-width: 1120px) {
  .site-grid {
    grid-template-columns: 140px minmax(0, 1fr) 250px;
    gap: 11px;
    padding: 14px;
  }
  .top-nav {
    gap: 17px;
  }
  .top-nav a {
    font-size: 12px;
  }
  .header-search {
    width: 165px;
  }
  .header-inner {
    gap: 18px;
  }
  .account-nav {
    gap: 10px;
  }
  .date-picker .today-button {
    display: none;
  }
  .fixture-head,
  .fixture-row {
    grid-template-columns: 55px minmax(0, 1fr) 48px 57px 60px;
  }
  .fixture-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }
  .fixture-teams {
    gap: 4px;
    grid-template-columns: 1fr 12px 1fr;
  }
  .fixture-action {
    font-size: 8px;
    padding: 3px;
  }
  .team-mini .crest {
    display: none;
  }
  .chat-panel .panel-heading h2 {
    font-size: 13px;
  }
  .article-list {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .article-preview,
  .article-preview:first-child,
  .article-preview:last-child {
    padding: 0 0 12px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .article-preview:last-child {
    padding: 0;
    border: 0;
  }
  .article-more {
    display: none;
  }
  .post-author {
    display: none;
  }
  .page-heading {
    align-items: flex-start;
  }
  .live-badge {
    margin-left: 3px;
  }
  .date-picker > span {
    padding: 5px;
  }
  .page-heading p {
    max-width: 250px;
  }
}
@media (max-width: 960px) {
  .left-sidebar {
    display: none;
  }
  .site-grid {
    grid-template-columns: minmax(0, 1fr) 260px;
    padding: 18px;
    gap: 15px;
  }
  .header-inner {
    flex-wrap: wrap;
    gap: 16px;
    min-height: 70px;
    padding-top: 12px;
    padding-bottom: 0;
  }
  .brand {
    margin-right: auto;
  }
  .top-nav {
    order: 4;
    width: 100%;
    height: 40px;
    justify-content: center;
    gap: 30px;
  }
  .header-search {
    margin-left: 0;
    width: 230px;
  }
  .account-nav {
    gap: 12px;
  }
  .fixture-teams .crest {
    display: inline-flex;
  }
  .fixture-head,
  .fixture-row {
    grid-template-columns: 68px minmax(0, 1fr) 50px 60px 65px;
  }
  .article-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
  }
  .article-preview,
  .article-preview:first-child,
  .article-preview:last-child {
    padding: 0 10px;
    border-bottom: 0;
    border-right: 1px solid var(--line);
  }
  .article-preview:last-child {
    border: 0;
  }
  .article-preview h3 {
    font-size: 11px;
  }
  .article-preview p {
    font-size: 9px;
  }
  .footer nav {
    gap: 10px;
  }
  .footer small {
    display: none;
  }
}
@media (max-width: 740px) {
  body {
    font-size: 12px;
    padding-bottom: 62px;
  }
  .header-inner {
    gap: 10px;
    padding: 13px 15px 0;
  }
  .brand {
    font-size: 23px;
  }
  .brand-mark {
    width: 25px;
  }
  .brand small {
    font-size: 8px;
  }
  .header-search {
    display: none;
  }
  .account-nav {
    font-size: 10px;
    gap: 10px;
  }
  .member-name {
    max-width: 85px;
  }
  .top-nav {
    gap: 0;
    justify-content: space-between;
    height: 43px;
  }
  .top-nav a {
    font-size: 11px;
  }
  .utility-strip > div {
    padding: 7px 15px;
    font-size: 9px;
  }
  .utility-strip > div > span:first-child {
    font-size: 8px;
  }
  .site-grid {
    grid-template-columns: 1fr;
    padding: 13px 10px 25px;
    gap: 16px;
  }
  .main-content {
    gap: 12px;
  }
  .right-sidebar {
    gap: 12px;
  }
  .right-sidebar .chat-panel {
    min-height: 430px;
  }
  .chat-messages {
    height: 290px;
  }
  .right-sidebar .popular-posts {
    display: none;
  }
  .announcement {
    font-size: 10px;
    padding: 8px 11px;
  }
  .demo-notice {
    font-size: 9px;
    line-height: 1.6;
  }
  .page-heading {
    padding: 15px 13px;
    align-items: center;
    gap: 8px;
  }
  .page-heading h1 {
    font-size: 21px;
  }
  .page-heading p {
    font-size: 10px;
    max-width: 230px;
  }
  .date-picker > span {
    font-size: 9px;
    padding: 4px;
    gap: 3px;
  }
  .date-picker > a {
    width: 15px;
    font-size: 18px;
  }
  .date-picker small {
    display: none;
  }
  .live-badge {
    font-size: 8px;
    padding: 2px 4px;
  }
  .sport-tabs {
    margin: 0 10px;
    gap: 0;
  }
  .sport-tabs a {
    padding: 8px 12px;
    font-size: 10px;
  }
  .status-filters {
    padding: 9px 12px;
  }
  .status-filters a {
    font-size: 9px;
  }
  .fixture-list {
    padding: 0 9px 4px;
  }
  .fixture-head,
  .fixture-row {
    grid-template-columns: 45px minmax(0, 1fr) 44px 47px 55px;
    gap: 4px;
  }
  .fixture-head {
    font-size: 8px;
    padding: 7px 3px;
  }
  .fixture-row {
    padding: 12px 3px;
    min-height: 67px;
  }
  .fixture-meta time {
    font-size: 9px;
  }
  .fixture-meta > a {
    font-size: 8px;
  }
  .fixture-score {
    font-size: 12px;
    letter-spacing: 0.5px;
  }
  .fixture-state,
  .fixture-state.live {
    font-size: 8px;
    white-space: normal;
  }
  .fixture-action {
    font-size: 8px;
    min-height: 26px;
    padding: 4px 3px;
  }
  .fixture-teams {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .fixture-teams .versus {
    display: none;
  }
  .team-mini,
  .team-mini.away {
    justify-content: flex-start;
    flex-direction: row;
    font-size: 10px;
    line-height: 1.4;
  }
  .team-mini:not(.away) .crest {
    order: 0;
  }
  .fixture-teams .crest {
    width: 16px;
    height: 18px;
    font-size: 5px;
    display: inline-flex;
  }
  .fixture-group {
    font-size: 9px;
  }
  .fixture-group small {
    font-size: 7px;
  }
  .league-strip {
    gap: 12px;
    font-size: 9px;
    padding: 11px 13px;
  }
  .league-strip strong {
    font-size: 9px;
  }
  .league-strip a {
    font-size: 9px;
  }
  .panel-heading {
    padding: 12px 13px;
  }
  .panel-heading h2 {
    font-size: 14px;
  }
  .panel-heading h2 > .subtle {
    font-size: 9px;
  }
  .compact-tabs {
    padding: 9px 12px 0;
    gap: 17px;
    font-size: 9px;
  }
  .board-scroll {
    padding: 0 11px 7px;
  }
  .board-table td.post-title {
    font-size: 11px;
    padding: 11px 3px;
  }
  .post-number,
  .post-author,
  .post-views,
  .post-votes {
    display: none;
  }
  .post-date {
    width: 35px;
    font-size: 8px;
  }
  .board-table th {
    padding: 8px 3px;
    font-size: 8px;
  }
  .article-list {
    grid-template-columns: 1fr;
    padding: 14px;
    gap: 14px;
  }
  .article-preview,
  .article-preview:first-child,
  .article-preview:last-child {
    border-right: 0;
    border-bottom: 1px solid var(--line);
    padding: 0 0 14px;
  }
  .article-preview:last-child {
    border: 0;
    padding: 0;
  }
  .article-preview h3 {
    font-size: 14px;
    margin: 7px 0 5px;
  }
  .article-preview p {
    font-size: 11px;
  }
  .article-category {
    font-size: 9px;
  }
  .mobile-nav {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 20;
    height: 61px;
    padding-bottom: env(safe-area-inset-bottom);
    border-top: 1px solid var(--line);
    background: #fff;
    justify-content: space-around;
  }
  .mobile-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex: 1;
    font-size: 20px;
    color: #527187;
    gap: 0;
  }
  .mobile-nav span {
    font-size: 9px;
    color: #788f9f;
    margin-top: -2px;
  }
  .footer > div {
    padding: 18px 15px;
    flex-wrap: wrap;
    gap: 10px;
  }
  .footer nav {
    gap: 10px;
    flex-wrap: wrap;
    font-size: 8px;
  }
  .footer-brand {
    font-size: 11px;
  }
  .page-home .right-sidebar,
  .page-sport .right-sidebar {
    margin-top: 0;
  }
  .team-grid {
    grid-template-columns: repeat(2, 1fr);
    padding: 15px;
    gap: 14px;
  }
  .team-profile {
    padding: 15px;
    gap: 12px;
    flex-wrap: wrap;
  }
  .team-standing {
    font-size: 9px;
  }
  .team-standing strong {
    font-size: 12px;
  }
  .team-profile strong {
    font-size: 15px;
  }
  .match-scoreboard {
    padding: 22px 10px;
    gap: 8px;
  }
  .match-scoreboard > a strong {
    font-size: 11px;
  }
  .big-score {
    font-size: 32px;
  }
  .match-scoreboard time {
    font-size: 8px;
  }
  .match-title {
    font-size: 14px;
  }
  .crest.big {
    width: 45px;
    height: 53px;
    font-size: 13px;
  }
  .match-location {
    font-size: 8px;
    flex-wrap: wrap;
    gap: 3px;
  }
  .section-tabs {
    font-size: 10px;
    gap: 20px;
    padding: 11px 13px;
  }
  .section-body {
    padding: 16px;
  }
  .article-detail .section-body {
    padding: 21px;
  }
  .article-detail h1,
  .post-detail h1 {
    font-size: 21px;
  }
  .article-lead {
    font-size: 12px;
  }
  .prose {
    font-size: 12px;
    line-height: 2;
  }
  .prose h2 {
    font-size: 16px;
  }
  .post-byline {
    font-size: 9px;
    gap: 9px;
  }
  .board-tabs {
    padding: 0 13px 12px;
    gap: 5px;
  }
  .board-tabs a {
    font-size: 10px;
    padding: 4px 7px;
  }
  .form-page {
    margin: 25px auto;
    min-height: 65vh;
  }
  .form-card {
    padding: 22px;
  }
  .form-card h1 {
    font-size: 23px;
  }
  .form-intro {
    font-size: 11px;
  }
  .page-chat .right-sidebar {
    grid-row: 1;
  }
  .admin-table {
    display: block;
    overflow-x: auto;
  }
  .admin-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .page-heading:has(+ .board-tabs) {
    display: block;
  }
  .page-blog .article-list {
    padding: 19px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  * {
    transition: none !important;
  }
}
/* Keep Korean table text readable and pair opponents near the versus label. */
.team-mini.away {
  justify-content: flex-start;
  flex-direction: row;
}
.fixture-head {
  font-size: 10px;
}
.fixture-meta time {
  font-size: 11px;
}
.fixture-meta > a {
  font-size: 10px;
}
.team-mini {
  font-size: 12px;
}
.fixture-state {
  font-size: 11px;
}
.fixture-state.live {
  font-size: 10px;
}
.fixture-action {
  font-size: 10px;
}
.fixture-row {
  min-height: 57px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.board-table td.post-title {
  font-size: 12px;
}
.board-table td {
  font-size: 11px;
}
.board-table th {
  font-size: 10px;
}
.chat-message strong {
  font-size: 11px;
}
.chat-message p {
  font-size: 12px;
}
.chat-message time {
  font-size: 9px;
}
.side-link {
  font-size: 13px;
}
.fixture-teams {
  gap: 6px;
}
.article-preview p {
  font-size: 11px;
}
.page-heading {
  padding-top: 18px;
  padding-bottom: 14px;
}
@media (max-width: 1280px) and (min-width: 741px) {
  .fixture-teams .crest {
    width: 19px;
    height: 22px;
  }
  .team-mini {
    font-size: 11px;
  }
  .fixture-head {
    font-size: 9px;
  }
  .fixture-meta > a {
    font-size: 9px;
  }
  .fixture-action {
    font-size: 9px;
  }
}
@media (max-width: 740px) {
  .fixture-meta time {
    font-size: 10px;
  }
  .fixture-meta > a {
    font-size: 8px;
  }
  .team-mini {
    font-size: 11px;
  }
  .fixture-state,
  .fixture-state.live {
    font-size: 9px;
  }
  .fixture-action {
    font-size: 8px;
  }
  .fixture-head {
    font-size: 8px;
  }
  .fixture-row {
    min-height: 67px;
  }
  .side-link {
    font-size: 12px;
  }
}
/* Readability pass: self-hosted Korean font, real body text, stronger contrast. */
:root {
  --muted: #617487;
  --ink: #203449;
  --canvas: #f1f3f6;
}
body {
  font-size: 15px;
  letter-spacing: -0.15px;
  line-height: 1.65;
}
.header-inner {
  gap: 25px;
}
.top-nav {
  gap: 23px;
}
.top-nav a {
  font-size: 15px;
}
.header-search input {
  font-size: 13px;
}
.header-search {
  height: 38px;
  width: 230px;
}
.account-nav,
.text-button {
  font-size: 13px;
}
.button {
  font-size: 13px;
}
.button.small {
  font-size: 12px;
}
.brand small {
  font-size: 11px;
  letter-spacing: 0.25px;
  color: #b6c8d5;
}
.utility-strip > div {
  font-size: 12px;
  color: #587084;
}
.utility-strip .muted {
  color: #65798a;
}
.side-section h2 {
  font-size: 15px;
  padding-bottom: 12px;
}
.side-link {
  font-size: 14px;
  padding: 9px 15px;
  color: #40566a;
}
.league-initial {
  font-size: 10px;
  width: 25px;
  height: 26px;
}
.sidebar-note strong {
  font-size: 18px;
}
.sidebar-note > span:last-of-type {
  font-size: 12px;
}
.tiny-label {
  font-size: 9px;
}
.panel-heading {
  padding: 15px 17px;
}
.panel-heading h2 {
  font-size: 17px;
}
.panel-heading > a:not(.button) {
  font-size: 12px;
  color: #667b8e;
}
.panel-heading h2 > .subtle,
.subtle {
  font-size: 12px;
  color: #687c8e;
}
.announcement {
  font-size: 13px;
  padding: 10px 14px;
}
.announcement-label {
  font-size: 12px;
}
.announcement-more {
  font-size: 12px;
  color: #6b8091;
}
.demo-notice {
  font-size: 12px;
  color: #647789;
  align-items: flex-start;
  line-height: 1.6;
}
.demo-notice > span {
  font-size: 10px;
  color: #657a8b;
  flex-shrink: 0;
}
.breadcrumb {
  font-size: 12px;
  color: #61778b;
}
.breadcrumb a {
  color: #4d687f;
}
.page-heading h1 {
  font-size: 25px;
}
.page-heading p {
  font-size: 14px;
  color: #5f7487;
  line-height: 1.7;
  margin-top: 6px;
}
.date-picker {
  font-size: 13px;
}
.date-picker > span {
  padding: 6px 9px;
}
.date-picker small {
  font-size: 12px;
  color: #647a8d;
}
.date-picker .today-button {
  font-size: 12px;
  width: 39px;
  height: 33px;
}
.live-badge {
  font-size: 11px;
  padding: 3px 7px;
}
.sport-tabs a {
  font-size: 13px;
  padding: 10px 13px;
  color: #587084;
}
.status-filters a {
  font-size: 12px;
  color: #61788a;
  padding: 3px 10px;
}
.status-filters > span {
  font-size: 11px;
  color: #657c8e;
}
.fixture-head,
.fixture-row {
  grid-template-columns: 81px minmax(0, 1fr) 64px 77px 85px;
  gap: 7px;
}
.fixture-head {
  font-size: 12px;
  color: #5b7286;
  padding: 9px 7px;
}
.fixture-row {
  min-height: 63px;
  padding: 12px 7px;
}
.fixture-meta time {
  font-size: 13px;
  color: #344f65;
}
.fixture-meta > a {
  font-size: 12px;
  color: #5e7486;
}
.team-mini {
  font-size: 14px;
  font-weight: 550;
  gap: 6px;
}
.crest {
  width: 25px;
  height: 29px;
  font-size: 8px;
}
.fixture-score {
  font-size: 17px;
  letter-spacing: 0.5px;
}
.fixture-state,
.fixture-state.live {
  font-size: 12px;
}
.fixture-state {
  color: #5f7486;
}
.fixture-action {
  font-size: 12px;
  min-height: 32px;
  padding: 5px 6px;
  color: #42677e;
}
.fixture-group {
  font-size: 12px;
  padding: 9px 8px;
  color: #32694f;
}
.fixture-group b {
  font-size: 11px;
}
.fixture-group small {
  font-size: 11px;
  color: #5d7d6a;
}
.league-strip {
  font-size: 12px;
  padding: 14px 17px;
}
.league-strip a,
.league-strip strong {
  font-size: 12px;
  color: #435f75;
}
.league-strip a > span {
  color: #6b8597;
}
.compact-tabs {
  font-size: 12px;
  gap: 18px;
}
.compact-tabs a {
  color: #607a8e;
}
.board-table th {
  font-size: 12px;
  color: #5d7589;
}
.board-table td {
  font-size: 12px;
  color: #5f7589;
  padding: 12px 4px;
}
.board-table td.post-title {
  font-size: 15px;
  color: #2e485d;
}
.post-author {
  width: 80px;
}
.post-date {
  width: 48px;
}
.post-views {
  width: 47px;
}
.post-votes {
  width: 39px;
}
.post-number {
  width: 50px;
}
.comment-count {
  font-size: 12px;
}
.notice-tag {
  font-size: 10px;
}
.board-tabs a {
  font-size: 13px;
}
.board-toolbar {
  font-size: 13px;
  color: #597387;
}
.pagination a {
  font-size: 13px;
}
.board-search input {
  font-size: 13px;
}
.chat-panel {
  min-height: 610px;
}
.chat-panel .panel-heading h2 {
  font-size: 17px;
}
.connection-indicator {
  font-size: 11px;
  color: #5f7a8d;
}
.chat-tabs button {
  font-size: 13px;
  color: #5f7689;
  padding: 8px 5px;
}
.chat-tabs button.active {
  padding-top: 7px;
}
.chat-notice {
  font-size: 12px;
  color: #4c725f;
  padding: 11px 14px;
}
.chat-messages {
  height: 382px;
}
.chat-message {
  padding: 10px 0;
  gap: 9px;
}
.chat-message strong {
  font-size: 13px;
  color: #304f67;
}
.chat-message time {
  font-size: 11px;
  color: #637d8f;
}
.chat-message p {
  font-size: 14px;
  line-height: 1.65;
  color: #3c566b;
  margin-top: 4px;
}
.chat-avatar {
  width: 29px;
  height: 29px;
  font-size: 12px;
}
.chat-compose input {
  font-size: 13px;
  padding: 9px;
}
.chat-compose .button {
  font-size: 13px;
}
.chat-feedback {
  font-size: 12px;
  min-height: 41px;
  color: #60798b;
}
.chat-empty {
  font-size: 13px;
  color: #5f7a8d;
}
.chat-room-picker label,
.chat-room-picker select {
  font-size: 12px;
}
.side-notices li {
  font-size: 13px;
  padding: 8px 0;
}
.side-notices li a {
  color: #445e73;
}
.side-notices time {
  font-size: 11px;
  color: #637e92;
}
.popular-posts li {
  font-size: 13px;
  padding: 9px 0;
}
.popular-posts a {
  color: #415e75;
}
.popular-posts li:before {
  font-size: 13px;
}
.popular-posts li > span {
  font-size: 11px;
  color: #667e90;
}
.article-category {
  font-size: 11px;
}
.article-preview h3 {
  font-size: 15px;
}
.article-preview p {
  font-size: 13px;
  color: #5e7689;
  line-height: 1.7;
}
.article-more {
  font-size: 12px;
  color: #5b788e;
}
.article-detail h1,
.post-detail h1 {
  font-size: 27px;
}
.article-lead {
  font-size: 16px;
  color: #587387;
}
.post-byline {
  font-size: 13px;
  color: #5d798e;
}
.prose {
  font-size: 16px;
  line-height: 1.9;
  color: #3d576c;
}
.prose h2 {
  font-size: 21px;
}
.editorial-note {
  font-size: 13px;
  color: #58768a;
}
.related-tags a {
  font-size: 12px;
}
.comment strong {
  font-size: 14px;
}
.comment time {
  font-size: 12px;
  color: #667f91;
}
.comment p {
  font-size: 15px;
  color: #405b70;
}
.report-form {
  font-size: 12px;
}
.empty-state strong {
  font-size: 15px;
}
.empty-state p {
  font-size: 13px;
  color: #607b8e;
}
.league-description {
  font-size: 15px;
  color: #536e83;
}
.league-country {
  font-size: 12px;
}
.team-grid a {
  font-size: 14px;
}
.team-profile p {
  font-size: 13px;
  color: #5d788d;
}
.team-standing {
  font-size: 13px;
}
.standing-table {
  font-size: 14px;
}
.standing-table th {
  font-size: 12px;
  color: #587489;
}
.match-meta {
  font-size: 13px;
  color: #5c788c;
}
.state-pill {
  font-size: 12px;
}
.match-title {
  font-size: 20px;
  color: #36566f;
}
.match-scoreboard > a strong {
  font-size: 16px;
}
.match-scoreboard > a small {
  font-size: 11px;
  color: #617d90;
}
.match-scoreboard > div > span {
  font-size: 13px;
}
.match-scoreboard time {
  font-size: 12px;
  color: #57758a;
}
.match-location {
  font-size: 12px;
  color: #58768c;
}
.broadcast-empty strong {
  font-size: 17px;
}
.broadcast-empty p {
  font-size: 14px;
  color: #59768b;
}
.quiet-label {
  font-size: 12px;
  color: #627e92;
}
.stat-row {
  font-size: 16px;
}
.stat-row strong {
  font-size: 14px;
  color: #55758b;
}
.section-tabs {
  font-size: 14px;
}
.footer nav {
  font-size: 12px;
}
.footer small {
  font-size: 11px;
}
.footer-brand {
  font-size: 15px;
}
.form-card .form-intro {
  font-size: 14px;
  color: #59778d;
}
.form-field label {
  font-size: 14px;
}
.form-field small,
.form-bottom {
  font-size: 13px;
  color: #5f7c90;
}
.validation-summary-errors,
.field-validation-error {
  font-size: 13px;
}
.admin-table {
  font-size: 13px;
}
@media (max-width: 1280px) and (min-width: 741px) {
  .header-inner {
    gap: 20px;
  }
  .top-nav {
    gap: 20px;
  }
  .header-search {
    width: 190px;
  }
  .header-search input {
    font-size: 12px;
  }
  .side-link {
    font-size: 14px;
    padding-left: 12px;
  }
  .fixture-head,
  .fixture-row {
    grid-template-columns: 67px minmax(0, 1fr) 60px 66px 77px;
    gap: 5px;
  }
  .fixture-meta {
    gap: 0;
    flex-direction: column;
    align-items: flex-start;
  }
  .team-mini {
    font-size: 13px;
  }
  .fixture-teams .crest {
    width: 23px;
    height: 27px;
    font-size: 7px;
  }
  .fixture-head {
    font-size: 11px;
  }
  .fixture-meta time {
    font-size: 12px;
  }
  .fixture-meta > a {
    font-size: 11px;
  }
  .fixture-state,
  .fixture-state.live {
    font-size: 11px;
  }
  .fixture-action {
    font-size: 11px;
  }
  .post-author {
    width: 65px;
  }
  .date-picker {
    font-size: 12px;
  }
  .page-heading h1 {
    font-size: 24px;
  }
  .sport-tabs a {
    font-size: 12px;
    padding: 10px;
  }
  .article-preview h3 {
    font-size: 14px;
  }
  .article-preview p {
    font-size: 12px;
  }
}
@media (max-width: 1120px) and (min-width: 741px) {
  .fixture-teams .crest {
    display: none;
  }
  .fixture-head,
  .fixture-row {
    grid-template-columns: 60px minmax(0, 1fr) 58px 62px 72px;
  }
  .header-search {
    width: 165px;
  }
  .top-nav {
    gap: 15px;
  }
  .top-nav a {
    font-size: 14px;
  }
  .account-nav {
    font-size: 12px;
  }
}
@media (max-width: 960px) {
  .top-nav {
    gap: 23px;
  }
  .top-nav a {
    font-size: 14px;
  }
  .header-search {
    width: 220px;
  }
}
@media (max-width: 740px) {
  body {
    font-size: 15px;
  }
  .header-inner {
    gap: 10px;
  }
  .top-nav {
    gap: 0;
  }
  .top-nav a {
    font-size: 13px;
  }
  .account-nav,
  .text-button {
    font-size: 12px;
  }
  .brand small {
    font-size: 10px;
  }
  .utility-strip > div {
    font-size: 11px;
  }
  .utility-strip > div > span:first-child {
    font-size: 10px;
  }
  .announcement {
    font-size: 12px;
  }
  .announcement-label,
  .announcement-more {
    font-size: 11px;
  }
  .demo-notice {
    font-size: 11px;
  }
  .page-heading {
    padding: 17px 13px;
    align-items: flex-start;
  }
  .page-heading h1 {
    font-size: 24px;
  }
  .page-heading p {
    font-size: 13px;
    max-width: 210px;
  }
  .date-picker > span {
    font-size: 12px;
    padding: 5px;
  }
  .date-picker > a {
    font-size: 22px;
    width: 17px;
  }
  .live-badge {
    font-size: 10px;
  }
  .sport-tabs a {
    font-size: 13px;
    padding: 10px 12px;
  }
  .status-filters a {
    font-size: 12px;
  }
  .status-filters > span {
    font-size: 10px;
  }
  .fixture-head,
  .fixture-row {
    grid-template-columns: 44px minmax(0, 1fr) 48px 51px 59px;
    gap: 4px;
  }
  .fixture-head {
    font-size: 10px;
    padding: 8px 3px;
  }
  .fixture-row {
    padding: 13px 3px;
    min-height: 79px;
  }
  .fixture-meta time {
    font-size: 12px;
  }
  .fixture-meta > a {
    font-size: 10px;
  }
  .team-mini,
  .team-mini.away {
    font-size: 14px;
    gap: 5px;
    justify-content: flex-start;
    flex-direction: row;
  }
  .fixture-teams .crest {
    width: 19px;
    height: 23px;
    font-size: 6px;
    display: inline-flex;
  }
  .fixture-score {
    font-size: 15px;
  }
  .fixture-state,
  .fixture-state.live {
    font-size: 11px;
  }
  .fixture-action {
    font-size: 10px;
    min-height: 31px;
  }
  .fixture-group {
    font-size: 12px;
  }
  .fixture-group small {
    font-size: 10px;
  }
  .league-strip,
  .league-strip a,
  .league-strip strong {
    font-size: 12px;
  }
  .panel-heading h2 {
    font-size: 17px;
  }
  .panel-heading h2 > .subtle {
    display: none;
  }
  .compact-tabs {
    font-size: 12px;
    gap: 15px;
  }
  .board-table td.post-title {
    font-size: 15px;
    line-height: 1.6;
    padding: 13px 3px;
  }
  .board-table th {
    font-size: 11px;
  }
  .post-date {
    width: 39px;
    font-size: 11px !important;
  }
  .article-preview h3 {
    font-size: 16px;
  }
  .article-preview p {
    font-size: 14px;
  }
  .article-more {
    display: flex;
  }
  .right-sidebar .chat-panel {
    min-height: 520px;
  }
  .chat-messages {
    height: 355px;
  }
  .footer nav {
    font-size: 11px;
  }
  .footer-brand {
    font-size: 14px;
  }
  .mobile-nav span {
    font-size: 12px;
  }
  .mobile-nav a {
    font-size: 22px;
  }
  .team-grid a {
    font-size: 14px;
  }
  .team-profile p {
    font-size: 12px;
  }
  .match-title {
    font-size: 18px;
  }
  .match-scoreboard > a strong {
    font-size: 14px;
  }
  .match-scoreboard time {
    font-size: 10px;
  }
  .match-location {
    font-size: 11px;
  }
  .section-tabs {
    font-size: 13px;
    gap: 17px;
  }
  .article-detail h1,
  .post-detail h1 {
    font-size: 25px;
  }
  .article-lead {
    font-size: 15px;
  }
  .prose {
    font-size: 16px;
  }
  .prose h2 {
    font-size: 20px;
  }
  .post-byline {
    font-size: 12px;
  }
  .board-tabs a {
    font-size: 12px;
  }
  .form-card .form-intro {
    font-size: 14px;
  }
}
.scoreboard-wrap {
  padding: 0 14px 10px;
}
.scoreboard-table {
  table-layout: fixed;
  font-size: 13px;
}
.scoreboard-table .col-league {
  width: 56px;
}
.scoreboard-table .col-time {
  width: 51px;
}
.scoreboard-table .col-state {
  width: 74px;
}
.scoreboard-table .col-score {
  width: 67px;
}
.scoreboard-table .col-watch {
  width: 68px;
}
.scoreboard-table thead {
  background: #f3f5f7;
}
.scoreboard-table th {
  font-size: 12px;
  font-weight: 500;
  color: #53677a;
  padding: 9px 5px;
  border-top: 1px solid #e4e9ee;
  border-bottom: 1px solid #dce4ea;
  text-align: center;
}
.scoreboard-table th.home-label {
  text-align: right;
  padding-right: 12px;
}
.scoreboard-table th.away-label {
  text-align: left;
  padding-left: 12px;
}
.scoreboard-row td {
  padding: 12px 5px;
  border-bottom: 1px solid #e6ebef;
  text-align: center;
  height: 53px;
}
.scoreboard-row:nth-child(odd) {
  background: #fbfcfd;
}
.scoreboard-row:hover {
  background: #f1f7f4;
}
.scoreboard-league a {
  font-size: 12px;
  font-weight: 600;
  color: #526c81;
}
.scoreboard-time {
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: #405b70;
}
.scoreboard-state {
  font-size: 12px;
  color: #61778a;
}
.scoreboard-row.is-live .scoreboard-state {
  color: #d33c4e;
  font-weight: 600;
}
.scoreboard-home > a,
.scoreboard-away > a {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 500;
}
.scoreboard-home > a {
  justify-content: flex-end;
}
.scoreboard-away > a {
  justify-content: flex-start;
}
.scoreboard-home > a > span:first-child,
.scoreboard-away > a > span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.scoreboard-table .crest {
  width: 20px;
  height: 24px;
  font-size: 6px;
}
.scoreboard-score a {
  display: block;
  background: #eef3f6;
  border-radius: 3px;
  font-size: 16px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.5px;
  line-height: 30px;
  color: #284961;
}
.scoreboard-row.is-live .scoreboard-score a {
  color: #d43d4e;
  background: #fff1f2;
}
.scoreboard-watch .button {
  font-size: 12px;
  padding: 4px 7px;
  min-height: 28px;
  border-color: #dce4ea;
  color: #4d6e84;
  background: #f8fafb;
}
.scoreboard-watch .button.primary {
  background: var(--green);
  color: #fff;
  border-color: var(--green);
}
.scoreboard-group td {
  padding: 9px 8px;
  background: #edf5f0;
  color: #35674f;
  border-top: 1px solid #dfeae3;
  border-bottom: 1px solid #dfeae3;
  font-size: 12px;
}
.scoreboard-group b {
  font-weight: 500;
  font-size: 11px;
  color: #47846a;
  margin-left: 3px;
}
.scoreboard-group small {
  float: right;
  font-size: 11px;
  color: #5e796b;
}
.scoreboard-group .dot {
  width: 5px;
  height: 5px;
}
.scoreboard-row:last-child td {
  border-bottom: 0;
}
@media (max-width: 1120px) and (min-width: 741px) {
  .scoreboard-wrap {
    padding: 0 10px 7px;
  }
  .scoreboard-table .col-league {
    width: 49px;
  }
  .scoreboard-table .col-time {
    width: 44px;
  }
  .scoreboard-table .col-state {
    width: 63px;
  }
  .scoreboard-table .col-score {
    width: 60px;
  }
  .scoreboard-table .col-watch {
    width: 58px;
  }
  .scoreboard-table .crest {
    display: none;
  }
  .scoreboard-home > a,
  .scoreboard-away > a {
    font-size: 13px;
  }
  .scoreboard-row td {
    padding-left: 4px;
    padding-right: 4px;
  }
  .scoreboard-state {
    font-size: 11px;
  }
  .scoreboard-table th {
    font-size: 11px;
  }
}
@media (max-width: 740px) {
  .scoreboard-wrap {
    padding: 0 10px 9px;
  }
  .scoreboard-table colgroup,
  .scoreboard-table thead {
    display: none;
  }
  .scoreboard-table,
  .scoreboard-table tbody {
    display: block;
    width: 100%;
  }
  .scoreboard-group {
    display: block;
  }
  .scoreboard-group td {
    display: block;
    width: 100%;
    padding: 8px;
  }
  .scoreboard-row {
    display: grid;
    grid-template-columns: 1fr 58px 1fr 53px;
    grid-template-areas: "meta time state watch" "home score away watch";
    gap: 5px 6px;
    padding: 11px 2px;
    border-bottom: 1px solid #e4ebf0;
  }
  .scoreboard-row td {
    display: block;
    height: auto;
    padding: 0;
    border: 0;
    text-align: left;
  }
  .scoreboard-league {
    grid-area: meta;
  }
  .scoreboard-time {
    grid-area: time;
    text-align: center !important;
    font-size: 11px;
  }
  .scoreboard-state {
    grid-area: state;
    text-align: left !important;
    font-size: 11px;
    white-space: nowrap;
  }
  .scoreboard-home {
    grid-area: home;
  }
  .scoreboard-score {
    grid-area: score;
    align-self: center;
  }
  .scoreboard-away {
    grid-area: away;
  }
  .scoreboard-watch {
    grid-area: watch;
    align-self: center;
  }
  .scoreboard-home > a,
  .scoreboard-away > a {
    font-size: 14px;
    gap: 4px;
  }
  .scoreboard-table .crest {
    display: none;
  }
  .scoreboard-score a {
    font-size: 16px;
    line-height: 29px;
  }
  .scoreboard-watch .button {
    font-size: 11px;
    padding: 4px 6px;
  }
  .scoreboard-group small {
    font-size: 10px;
  }
  .scoreboard-league a {
    font-size: 11px;
  }
}
.scoreboard-score a {
  white-space: nowrap;
  letter-spacing: 0;
}
.scoreboard-table .col-score {
  width: 78px;
}
.home-hero{position:relative;isolation:isolate;overflow:hidden;min-height:290px;border-radius:12px;margin:0 0 20px;background:#0c2031;color:white}.home-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 60%;z-index:-2}.home-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,22,35,.94),rgba(7,22,35,.55) 55%,rgba(7,22,35,.08));z-index:-1}.hero-copy{padding:34px 32px}.hero-eyebrow{font-size:12px;letter-spacing:.18em;color:#76e4b0;font-weight:750}.hero-copy h2{font-size:32px;line-height:1.3;letter-spacing:-.04em;margin:12px 0}.hero-copy p{font-size:15px;line-height:1.65;color:#dae5ee;margin:0 0 22px}.hero-actions{display:flex;align-items:center;gap:20px}.hero-actions .button{padding:12px 17px;font-size:14px}.hero-secondary{font-size:14px;color:#eef5fa}.livescore-frame{display:block;border:0;width:100%;height:calc(100vh - 230px);min-height:740px;background:white}.embed-help{padding:14px 20px;color:#617487;font-size:13px;border-top:1px solid #e6ebef}.top-nav{gap:18px}@media(max-width:740px){.home-hero{min-height:290px;border-radius:9px}.hero-copy{padding:28px 22px}.hero-copy h2{font-size:29px}.hero-actions{align-items:flex-start;flex-direction:column;gap:14px}.livescore-frame{height:78vh;min-height:640px}.livescore-panel .page-heading{align-items:flex-start;gap:10px;flex-direction:column}}
.play-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.play-card{border:1px solid #e4eaf0;border-radius:12px;padding:24px;background:#f8fbfa}.play-icon{font-size:34px}.play-card h2{font-size:20px;margin:12px 0}.play-card p{color:#617487;line-height:1.6}.play-card form,.play-card>a{margin-top:18px}.point-balance{font-size:25px;color:#008b69;white-space:nowrap}.quiz-list{display:grid;gap:14px}.quiz-card{padding:20px;border:1px solid #e3e9ef;border-radius:10px}.quiz-card h3{font-size:16px;margin:0 0 15px}.quiz-card label{display:inline-flex;align-items:center;margin:0 18px 12px 0;gap:6px}.quiz-card button{display:block}.point-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #e7edf1}.point-row strong{color:#008b69}.penalty-pitch{position:relative;height:250px;overflow:hidden;border-radius:12px;background:repeating-linear-gradient(0deg,#22784c 0 42px,#288555 42px 84px);padding:24px;text-align:center;color:white}.penalty-goal{width:75%;height:115px;border:5px solid white;border-bottom:0;position:relative;margin:auto;background:repeating-linear-gradient(90deg,transparent 0 20px,#ffffff25 20px 21px)}.penalty-goal span{position:absolute;left:50%;bottom:0;font-size:38px;transform:translateX(-50%);transition:left .2s}.penalty-ball{position:absolute;left:50%;bottom:55px;font-size:30px;transform:translateX(-50%)}.penalty-ball.shot{animation:shoot .4s forwards}.penalty-pitch p{position:absolute;bottom:7px;left:10px;right:10px;font-weight:650}.penalty-controls{display:flex;gap:10px;justify-content:center;margin:18px 0;flex-wrap:wrap}@keyframes shoot{to{bottom:125px;transform:translateX(-50%) scale(.6)}}@media(max-width:740px){.play-grid{grid-template-columns:1fr}.quiz-card label{display:flex}.play-card{padding:20px}}@media(prefers-reduced-motion:reduce){.penalty-ball.shot{animation:none;bottom:125px}.penalty-goal span{transition:none}}
.play-card>strong{display:block;margin-top:14px}.play-card>a.button{display:inline-flex}
.score-launch{text-align:center;padding:52px 24px;line-height:1.8}.score-launch-icon{font-size:44px;color:#008e70}.score-launch h2{font-size:24px;margin:14px 0}.score-launch p{color:#64748b}.score-launch>.button.primary{margin:12px 0 20px}.score-launch p.muted{font-size:13px}

/* Admin console redesign */
.admin-console{--admin-bg:#07111f;--admin-panel:rgba(15,23,42,.94);--admin-panel-2:rgba(20,31,51,.94);--admin-line:rgba(148,163,184,.18);--admin-text:#edf5ff;--admin-muted:#9fb1c7;--admin-green:#22c55e;--admin-sky:#38bdf8;--admin-red:#fb7185;min-height:calc(100vh - 150px);padding:32px clamp(16px,3vw,44px) 70px;background:radial-gradient(circle at 18% 0,rgba(34,197,94,.2),transparent 29%),radial-gradient(circle at 90% 10%,rgba(56,189,248,.16),transparent 30%),linear-gradient(180deg,#07111f,#0b1220 48%,#070d18);color:var(--admin-text)}
.admin-console a{color:inherit}.admin-hero{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;max-width:1560px;margin:0 auto 18px;padding:28px 30px;border:1px solid var(--admin-line);border-radius:26px;background:linear-gradient(135deg,rgba(15,23,42,.98),rgba(12,39,54,.92));box-shadow:0 24px 80px rgba(0,0,0,.38)}
.admin-hero h1{margin:8px 0;color:white;font-size:clamp(32px,4vw,52px);letter-spacing:-.055em}.admin-hero p{max-width:720px;margin:0;color:#aec0d5;font-size:16px;line-height:1.65}.admin-hero-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.admin-console .article-category{color:#86efac;font-weight:900;letter-spacing:.18em}
.admin-kpi-grid,.admin-app-grid,.admin-board-grid{max-width:1560px;margin:0 auto;display:grid;gap:16px}.admin-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:16px}.admin-kpi{position:relative;overflow:hidden;min-height:138px;padding:22px;border:1px solid var(--admin-line);border-radius:22px;background:linear-gradient(145deg,rgba(30,41,59,.92),rgba(15,23,42,.9));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}.admin-kpi:after{content:"";position:absolute;right:-28px;top:-34px;width:110px;height:110px;border-radius:999px;background:rgba(56,189,248,.1)}.admin-kpi span{color:#aac0d6;font-size:13px;font-weight:850}.admin-kpi strong{display:block;margin:14px 0 8px;color:white;font-size:44px;line-height:1;letter-spacing:-.05em}.admin-kpi small{color:#8ea3bb}.admin-kpi.is-alert{border-color:rgba(251,113,133,.45)}.admin-kpi.is-alert:after{background:rgba(251,113,133,.16)}
.admin-app-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:16px}.admin-app-card{display:block;min-height:130px;padding:20px;border:1px solid var(--admin-line);border-radius:20px;background:rgba(15,23,42,.74);text-decoration:none;transition:.16s ease}.admin-app-card:hover{transform:translateY(-2px);border-color:rgba(56,189,248,.55);background:rgba(25,39,63,.9)}.admin-app-card b{display:block;margin-bottom:10px;color:white;font-size:17px}.admin-app-card span{display:block;color:#95a9c0;font-size:13px;line-height:1.55}
.admin-board-grid{grid-template-columns:minmax(0,1.75fr) minmax(360px,.75fr);align-items:start}.admin-board-grid.compact{grid-template-columns:1fr 1fr;margin-top:16px}.admin-side-stack{display:grid;gap:16px}.admin-panel{padding:22px;border:1px solid var(--admin-line);border-radius:24px;background:rgba(15,23,42,.82);box-shadow:0 18px 54px rgba(0,0,0,.24)}.admin-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}.admin-panel h2{margin:0;color:white;font-size:22px;letter-spacing:-.03em}.admin-panel p{margin:6px 0 0;color:#91a6bd;font-size:13px}.admin-table-wrap{overflow:auto;border-radius:18px}.admin-table-modern{min-width:860px;border:1px solid var(--admin-line)!important;border-collapse:separate!important;border-spacing:0!important;background:rgba(2,6,23,.36)!important;color:#dce8f7!important}.admin-table-modern th{background:rgba(30,41,59,.96)!important;color:#aec0d5!important;font-size:12px!important;letter-spacing:.04em;text-transform:uppercase}.admin-table-modern th,.admin-table-modern td{padding:14px 16px!important;border-bottom:1px solid rgba(148,163,184,.12)!important;vertical-align:middle}.admin-table-modern td>a{color:#86efac;font-weight:850;text-decoration:none}.admin-table-modern td small{display:block;margin-top:4px;color:#8196ad}.admin-table-modern tr:hover td{background:rgba(56,189,248,.055)}
.admin-inline-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.admin-inline-form input[type=number]{width:64px;text-align:center}.admin-inline-form input[name=phase]{width:120px}.score-sep{color:#6f849c;font-weight:900}.admin-console input,.admin-console select,.admin-console textarea{min-height:40px;border:1px solid rgba(148,163,184,.24);border-radius:12px;background:rgba(2,6,23,.58);color:#f8fbff;padding:9px 11px}.admin-console input::placeholder,.admin-console textarea::placeholder{color:#71849d}.admin-console .button,.admin-console button.button{border:1px solid rgba(148,163,184,.24);background:rgba(30,41,59,.84);color:#f8fbff;box-shadow:none}.admin-console .button:hover,.admin-console button.button:hover{border-color:rgba(56,189,248,.6);background:rgba(37,99,235,.22)}.admin-console .button.primary{border-color:rgba(34,197,94,.55);background:linear-gradient(135deg,#16a34a,#0284c7);color:white}.admin-pill{display:inline-flex;align-items:center;justify-content:center;min-width:58px;padding:6px 10px;border-radius:999px;background:rgba(148,163,184,.14);color:#cbd5e1;font-size:12px;font-weight:900}.admin-pill.state-live{background:rgba(34,197,94,.16);color:#86efac}.admin-pill.state-finished{background:rgba(56,189,248,.14);color:#bae6fd}.admin-pill.state-cancelled,.admin-pill.state-postponed{background:rgba(251,113,133,.16);color:#fecdd3}.admin-mini-details{min-width:160px}.admin-mini-details summary{cursor:pointer;color:#bae6fd;font-weight:850}.admin-stack-form{display:grid;gap:8px;margin-top:10px}.admin-list-item{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-top:1px solid rgba(148,163,184,.12)}.admin-list-item:first-of-type{border-top:0}.admin-list-item strong{display:block;color:#f8fbff}.admin-list-item span,.admin-list-item small{display:block;margin-top:3px;color:#93a7be;font-size:13px}.admin-empty{padding:22px;border:1px dashed rgba(148,163,184,.22);border-radius:16px;color:#8ea3bb;text-align:center}
@media(max-width:1180px){.admin-kpi-grid,.admin-app-grid,.admin-board-grid,.admin-board-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-board-grid{align-items:stretch}.admin-side-stack{display:contents}.admin-hero{align-items:flex-start;flex-direction:column}}@media(max-width:720px){.admin-console{padding:18px 10px 80px}.admin-hero,.admin-panel,.admin-kpi,.admin-app-card{border-radius:18px;padding:18px}.admin-kpi-grid,.admin-app-grid,.admin-board-grid,.admin-board-grid.compact{grid-template-columns:1fr}.admin-hero-actions,.admin-hero-actions .button{width:100%}.admin-hero-actions .button{justify-content:center}.admin-table-modern{min-width:760px}.admin-kpi strong{font-size:36px}}
/* Mobile portal: readable controls and match cards */
@media(max-width:740px){
body:not(.admin-body){font-size:14px;padding-bottom:calc(72px + env(safe-area-inset-bottom));-webkit-text-size-adjust:100%}
.header-inner{padding:14px 16px 0;gap:12px;flex-wrap:wrap}.brand{font-size:23px}.brand small{font-size:10px}.account-nav{margin-left:auto;font-size:12px;gap:10px}.account-nav .member-name{max-width:90px}.top-nav{width:100%;height:48px;overflow-x:auto;justify-content:flex-start;gap:22px;white-space:nowrap;scrollbar-width:none}.top-nav::-webkit-scrollbar{display:none}.top-nav a{font-size:14px;flex-shrink:0;display:flex;align-items:center;min-height:44px}.utility-strip>div{padding:9px 16px;font-size:11px}.utility-strip>div>span:first-child{font-size:11px}.utility-strip>div>span:last-child{display:none}
.site-grid{display:grid;grid-template-columns:minmax(0,1fr);padding:14px 12px 24px;gap:18px;width:100%;min-width:0}.main-content,.right-sidebar{min-width:0;width:100%;gap:16px}.left-sidebar{display:none}.panel{min-width:0;border-radius:12px;overflow:hidden}.announcement{font-size:12px;padding:11px 12px;gap:8px}.announcement a:not(.announcement-more){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.announcement-more{flex-shrink:0}.demo-notice{font-size:12px}.home-hero{min-height:260px;margin-bottom:0;border-radius:12px}.hero-copy{padding:26px 22px}.hero-copy h2{font-size:28px;line-height:1.35}.hero-copy p{font-size:14px;line-height:1.6;margin-bottom:18px}.hero-actions{flex-direction:row;flex-wrap:wrap;gap:12px}.hero-actions .button{min-height:44px;font-size:13px;padding:10px 14px}.hero-secondary{font-size:12px}.home-hero:after{background:linear-gradient(90deg,#071623ed,#07162388)}
.page-heading{padding:18px 16px;flex-wrap:wrap;gap:14px}.page-heading h1{font-size:23px}.page-heading p{font-size:13px;max-width:none;line-height:1.6}.date-picker{margin-left:auto}.date-picker>span{font-size:12px;padding:7px}.date-picker>a{width:32px;min-height:40px;display:grid;place-items:center}.sport-tabs,.compact-tabs,.section-tabs{display:flex;overflow-x:auto;white-space:nowrap;scrollbar-width:none;flex-wrap:nowrap}.sport-tabs a,.compact-tabs a,.section-tabs a{font-size:13px;padding:12px 14px;min-height:44px;flex-shrink:0}.status-filters{padding:12px 14px;gap:8px;display:flex;flex-wrap:wrap}.status-filters a{font-size:12px;min-height:36px;padding:8px 12px}.panel-heading{padding:16px;gap:8px;flex-wrap:wrap}.panel-heading h2{font-size:17px}.panel-heading .subtle{font-size:12px}.panel-heading .button{min-height:36px;font-size:12px}.section-body{padding:16px}.league-strip{overflow-x:auto;white-space:nowrap;flex-wrap:nowrap;font-size:12px;padding:14px}
.scoreboard-wrap{overflow:visible}.scoreboard-table{display:block;min-width:0;width:100%;table-layout:auto}.scoreboard-table colgroup,.scoreboard-table thead{display:none}.scoreboard-table tbody{display:block;width:100%}.scoreboard-group{display:block;background:#f4f7fa}.scoreboard-group td{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font-size:12px;border:0}.scoreboard-group small{font-size:10px}.scoreboard-row{display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);gap:5px 7px;padding:14px 16px;border-bottom:1px solid #e8edf2;align-items:center}.scoreboard-row td{display:block;width:auto!important;border:0;padding:0!important;background:none;min-width:0}.scoreboard-league{grid-column:1;grid-row:1;font-size:11px;text-align:left}.scoreboard-time{grid-column:2;grid-row:1;text-align:center;font-size:11px}.scoreboard-state{grid-column:3;grid-row:1;text-align:right;font-size:11px}.scoreboard-home{grid-column:1;grid-row:2}.scoreboard-score{grid-column:2;grid-row:2;text-align:center}.scoreboard-away{grid-column:3;grid-row:2}.scoreboard-home a,.scoreboard-away a{display:flex;align-items:center;gap:6px;min-height:44px;font-size:13px;font-weight:600;white-space:normal}.scoreboard-home a{justify-content:flex-start;flex-direction:row-reverse}.scoreboard-away a{justify-content:flex-start}.scoreboard-row .crest{width:24px;height:24px;font-size:9px;flex-shrink:0}.scoreboard-home a>span:not(.crest),.scoreboard-away a>span:not(.crest){overflow-wrap:anywhere;text-align:left}.scoreboard-score a{font-size:18px;display:grid;place-items:center;min-height:44px}.scoreboard-watch{grid-column:1/-1;grid-row:3;text-align:right}.scoreboard-watch .button{font-size:11px;min-height:32px;padding:6px 12px}
.chat-messages{height:300px;font-size:14px}.chat-message-content p{font-size:14px;line-height:1.65}.chat-message-content strong{font-size:12px}.chat-compose{gap:8px;padding:12px}.chat-compose input{min-width:0;width:100%;font-size:16px;min-height:44px}.chat-compose button{min-height:44px;flex-shrink:0}.chat-tabs button{font-size:13px;min-height:44px}.chat-notice,.chat-feedback{font-size:12px}.right-sidebar .chat-panel{min-height:0}.post-title{font-size:14px}.article-grid,.team-grid{grid-template-columns:1fr}.mobile-nav{height:calc(62px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#fffffffa;box-shadow:0 -3px 18px #16324c0c}.mobile-nav a{font-size:20px;min-width:44px}.mobile-nav a span{font-size:11px}.footer{padding:24px 16px}.footer nav{flex-wrap:wrap;gap:12px}.footer small{font-size:11px}
}
@media(max-width:380px){.account-nav{gap:7px;font-size:11px}.brand{font-size:20px}.brand-mark{width:22px}.hero-copy{padding:23px 18px}.hero-copy h2{font-size:25px}.scoreboard-row{padding:12px;grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr)}.scoreboard-row .crest{display:none}}
.theme-toggle{display:grid;place-items:center;width:36px;height:36px;border:1px solid #ffffff30;border-radius:50%;color:#fff;font-size:20px;flex-shrink:0}.theme-toggle:hover{background:#ffffff15}
html[data-theme=dark]{color-scheme:dark;--ink:#e0e8ef;--muted:#9baabd;--line:#2a3746;--canvas:#101923;--green:#39c89e;--green-dark:#22ab85}
html[data-theme=dark] body:not(.admin-body){background:var(--canvas);color:var(--ink)}
html[data-theme=dark] :is(.panel,.left-sidebar,.side-section,.form-card,.announcement,.utility-strip,.mobile-nav,.article-card,.play-card,.quiz-card,.team-grid a,.scoreboard-table,.scoreboard-row,.chat-compose,.chat-tabs,.chat-room-picker,.arcade-wallet){background:#182430;color:#e0e8ef;border-color:#2a3746}
html[data-theme=dark] :is(.scoreboard-table th,.scoreboard-group,.scoreboard-group td,.scoreboard-row.is-live,.chat-notice,.compact-tabs,.status-filters,.league-strip,.date-picker,.stat-row,.play-card,.post-row:hover,.scoreboard-row:hover,.scoreboard-row:hover td){background:#1d2c3b;color:#b6c5d4;border-color:#2a3746}
html[data-theme=dark] :is(input,select,textarea){background:#111d29;color:#e0e8ef;border-color:#3b4b5e}
html[data-theme=dark] :is(input,textarea)::placeholder{color:#91a2b5}
html[data-theme=dark] :is(.page-heading h1,.panel-heading h2,.side-section h2,.form-card h1,.form-card h2,.article-card h3,.play-card h2,.quiz-card h3,.post-title,.scoreboard-home a,.scoreboard-away a,.scoreboard-score a,.chat-message-content strong,.article-detail h1,.post-detail h1,.arcade-heading h1){color:#e5edf5}
html[data-theme=dark] :is(.subtle,.muted,.page-heading p,.post-byline,.chat-feedback,.chat-notice,.chat-message-content time,.article-card p,.article-meta,.empty-state p,.play-card p,.side-notices time,.scoreboard-time,.scoreboard-state,.arcade-heading p){color:#9aadc0}
html[data-theme=dark] :is(.button:not(.primary),.status-filters a,.date-picker>a,.chat-tabs button,.side-link,.compact-tabs a){color:#b7c9d9;border-color:#34475b}
html[data-theme=dark] .button:not(.primary){background:#243547}
html[data-theme=dark] :is(.side-link.selected,.side-link:hover,.status-filters a.active,.sport-tabs a.active,.compact-tabs a.active){color:#65dbb6;background:#193d37}
html[data-theme=dark] :is(.scoreboard-table td,.scoreboard-table th,.panel-heading,.post-row,.chat-message,.chat-tabs,.section-body,.point-row,.comment,.sport-tabs,.compact-tabs,.side-notices li,.league-strip){border-color:#2a3746}
html[data-theme=dark] .scoreboard-row td{background:transparent}
html[data-theme=dark] .chat-message-content p{color:#c7d5e2}
html[data-theme=dark] .mobile-nav{box-shadow:0 -3px 18px #0003}
html[data-theme=dark] .crest{color:#fff}
html[data-theme=dark] .button.primary{background:#168465;color:#fff;border-color:#168465}
html[data-theme=dark] .announcement-label{background:#214438;color:#64d4ac}
@media(max-width:740px){.theme-toggle{width:34px;height:34px;font-size:19px}.account-nav{gap:8px}}

.sports-intro .section-body{padding:24px}.sports-intro p{font-size:14px;line-height:1.85;color:var(--muted);word-break:keep-all;overflow-wrap:anywhere}.sports-intro a:not(.panel-heading a){color:var(--green)}.sports-intro .intro-lead{font-size:15px;color:var(--ink);margin-bottom:24px}.sports-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.sports-intro h3{font-size:16px;color:var(--ink);margin-bottom:10px}.sports-intro .intro-section-title{margin-top:28px}.sports-guide-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.sports-guide-links a{border:1px solid var(--line);border-radius:7px;padding:14px;background:var(--canvas)}.sports-guide-links strong{display:block;font-size:14px}.sports-guide-links span{display:block;font-size:11px;color:var(--muted);margin-top:5px}.sports-intro .intro-note{font-size:12px;margin-top:12px}.sports-faq details{border-top:1px solid var(--line);padding:15px 0}.sports-faq summary{cursor:pointer;font-size:14px;font-weight:600;color:var(--ink);line-height:1.6}.sports-faq details p{margin-top:12px}.sports-intro>.section-body>p{margin:12px 0}.sports-intro>.section-body>h3{margin-top:20px}@media(max-width:740px){.sports-intro .section-body{padding:18px}.sports-intro-grid{grid-template-columns:1fr;gap:22px}.sports-guide-links{grid-template-columns:1fr 1fr}.sports-faq summary{min-height:32px}.sports-intro p{font-size:14px}}
.home-hero>picture{position:absolute;inset:0;z-index:-2}.home-hero>picture>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 60%}


/* Dark surfaces and readable text for components with fixed light colors. */
html[data-theme=dark] body:not(.admin-body){--red:#ff8795}
html[data-theme=dark] :is(.side-notices li a,.popular-posts a,.scoreboard-league a,.post-table a,.chat-message strong,.article-detail,.post-detail){color:#dce6f0}
html[data-theme=dark] :is(.connection-indicator,.chat-empty,.chat-message time,.popular-posts li>span,.side-notices time,.scoreboard-time,.scoreboard-state,.embed-help,.score-launch p,.form-intro){color:#a9bbce}
html[data-theme=dark] .chat-message p{color:#d0dce8}
html[data-theme=dark] .chat-tabs button{background:#202f40;color:#b9c9d9;border-color:#3b4e63}
html[data-theme=dark] .chat-tabs button.active{background:#183e36;color:#8aebc9;border-color:#329b7d}
html[data-theme=dark] .chat-avatar{background:#26394a;color:#c5ecdf}
html[data-theme=dark] .scoreboard-score a{background:#27394b;color:#edf4fa}
html[data-theme=dark] .scoreboard-row.is-live .scoreboard-score a{background:#442732;color:#ff9daa}
html[data-theme=dark] .scoreboard-row.is-live .scoreboard-state{color:#ff9daa}
html[data-theme=dark] .live-badge{background:#442732;color:#ff9daa}
html[data-theme=dark] :is(.side-notices a,.popular-posts a,.scoreboard-league a):hover{color:#78e5c1}
html[data-theme=dark] :is(.post-table th,.standings-table th){background:#202f40;color:#b9c9d9}
html[data-theme=dark] :is(.post-table td,.standings-table td,.article-detail,.post-detail,.comment-form,.empty-state,.embed-help){background:#182430;border-color:#34475b}
html[data-theme=dark] :is(.form-card label,.comment-body,.post-body){color:#dce6f0}
html[data-theme=dark] :is(input,select,textarea):focus-visible{outline:2px solid #64d4ac;outline-offset:2px}

.fixture-list-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.fixture-list-footer>a{color:var(--green)}.fixture-pagination{display:flex;gap:5px;align-items:center}.fixture-pagination :is(a,span){display:grid;place-items:center;min-width:32px;padding:5px 9px;border:1px solid var(--line);border-radius:5px;color:var(--ink)}.fixture-pagination [aria-current]{background:var(--green-dark);color:#fff;border-color:var(--green-dark)}

/* Dark team placeholders must not mix their surface with white. */
html[data-theme=dark] .crest{background:color-mix(in srgb,var(--team,#52708c) 22%,#202f40);border-color:color-mix(in srgb,var(--team,#52708c) 35%,#53677c);color:#e6eef7;box-shadow:none}
html[data-theme=dark] .scoreboard-table .crest{font-size:8px;font-weight:700}

/* Broadcast player, category pills and live/upcoming cards share dark surfaces. */
html[data-theme=dark] .live-watch{background:#182430;border-color:#34475b}
html[data-theme=dark] .live-watch h2{color:#e5edf5}
html[data-theme=dark] .live-watch p{color:#b5c6d7}
html[data-theme=dark] #broadcast-filters button{background:#202f40;color:#c8d6e4;border-color:#3b4e63}
html[data-theme=dark] #broadcast-filters button[aria-pressed=true]{background:#183e36;border-color:#329b7d;color:#8aebc9}
html[data-theme=dark] #broadcast-list :is(button,article){background:#182430;color:#e5edf5;border:1px solid #34475b;border-radius:12px;padding:20px}
html[data-theme=dark] #broadcast-list button:disabled{background:#16212d;color:#b5c6d7;opacity:1}
html[data-theme=dark] #broadcast-list button[aria-current=true]{background:#18352f;border-color:#4bc9a2}
html[data-theme=dark] #broadcast-list button:not(:disabled):hover{background:#223447;border-color:#65809b}
html[data-theme=dark] #broadcast-list h3{color:inherit}
html[data-theme=dark] #broadcast-list p,html[data-theme=dark] #broadcast-status{color:#a9bbce}
html[data-theme=dark] #broadcast-list span{color:#78dfba}
html[data-theme=dark] #broadcast-list button:disabled span{color:#a9bbce}

/* Dark-mode page audit corrections */
html[data-theme=dark] :is(.header-search,.footer,.skip-link,.section-tabs,.broadcast-empty){background:#182430;border-color:#34475b;color:#dce6f0}
html[data-theme=dark] :is(.header-search button,.footer-brand,.footer nav a,.footer small,.utility-strip span,.announcement-more,.panel-heading>a,.breadcrumb a,.breadcrumb span,.quiet-label,.form-bottom,.form-card small,.board-toolbar span,.post-byline strong,.team-hero p,.league-intro p,.match-meta a,.match-meta span,.match-scoreboard small,.match-scoreboard time,.match-location,.scoreboard-group small){color:#b5c6d7}
html[data-theme=dark] :is(.section-body p,.prose,.prose p,.prose h2,.match-title,.broadcast-empty strong){color:#dce6f0}
html[data-theme=dark] :is(.editorial-note,.related-tags a,.board-table th){background:#202f40;color:#bdcddd;border-color:#34475b}
html[data-theme=dark] .board-table td{color:#b5c6d7;border-color:#34475b}
html[data-theme=dark] .board-table :is(td.post-title,th.post-title){color:#e4edf5}
html[data-theme=dark] .board-table tr:hover td{background:#202f40}
html[data-theme=dark] .board-tabs a{color:#b5c6d7}
html[data-theme=dark] :is(.board-tabs a.active,.notice-tag,.article-category){background:#183e36;color:#8aebc9}
html[data-theme=dark] .pagination a{background:#202f40;border-color:#34475b;color:#dce6f0}
html[data-theme=dark] .pagination a.active{background:#183e36;border-color:#329b7d;color:#8aebc9}
html[data-theme=dark] .state-pill{background:#442732;color:#ff9daa}
html[data-theme=dark] .scoreboard-group b{color:#78dfba}
html[data-theme=dark] .chat-message:nth-child(3n+2) .chat-avatar{background:#203e38;color:#b6ebd8}
html[data-theme=dark] .chat-message:nth-child(3n) .chat-avatar{background:#443044;color:#efd1e7}
html[data-theme=dark] .flash{background:#183e36;color:#8aebc9;border:1px solid #329b7d}
html[data-theme=dark] :is(.date-tabs small,.date-strip small,.sport-tabs a,.status-filters>span,.league-strip strong,.league-strip a,.league-strip span,.article-preview p,.article-more){color:#b5c6d7} html[data-theme=dark] .fixture-pagination [aria-current]{background:#08775f;border-color:#08775f} html[data-theme=dark] :is(.point-balance,.point-row strong){color:#8aebc9}
html[data-theme=dark] :is(.broadcast-empty p,.team-heading p,.league-heading p,.date-nav small){color:#b5c6d7}
html[data-theme=dark] :is(.team-profile p,.league-description p,.date-picker small){color:#b5c6d7}
