/* Homepage match cards and Super Tips. Loaded after theme.css; keep component styles scoped. */
.sketch-match-card {
  display:grid; grid-template-columns: 1fr 1fr; min-height:260px;
  margin:0 0 14px; overflow:hidden; border:1px solid #d5e4df;
  border-radius:18px; background:#fff; box-shadow:0 8px 24px rgba(8,45,32,.08);
  color:#063b2b;
}
.sketch-match-left {min-width:0; border-right:1px solid #dbe5e2;}
.sketch-league {display:flex; align-items:center; gap:12px; padding:15px 20px; min-height:62px;
  background:#f1f8f4; font-size:17px; font-weight:800;}
.sketch-league a {color:#61777a; font-weight:600; text-decoration:none;}
.sketch-dot {color:#84999a;}
.sketch-flag {width:34px;height:25px;object-fit:contain;}
.sketch-fixture {display:grid;grid-template-columns:minmax(0,1fr) minmax(110px,1fr) minmax(0,1fr);
  align-items:center; gap:6px; padding:18px 14px; min-height:196px;}
.sketch-team {min-width:0;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;}
.sketch-team a {font-size:19px;font-weight:800;color:#063b2b;text-decoration:none;overflow-wrap:anywhere;}
.sketch-team-logo,.sketch-team-logo-placeholder {width:86px;height:86px;object-fit:contain;}
.sketch-team-logo-placeholder {display:grid;place-items:center;font-size:38px;}
.sketch-kickoff {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  border-left:1px solid #dbe5e2;border-right:1px solid #dbe5e2;min-height:120px;text-align:center;}
.sketch-kickoff span {font-size:15px;color:#697f81;font-weight:700;}
.sketch-kickoff strong {font-size:35px;line-height:1.1;font-weight:900;color:#065c35;}
.sketch-kickoff small {font-size:11px;color:#697f81;}
.sketch-match-right {position:relative;min-width:0;display:flex;flex-direction:column;justify-content:center;
  gap:16px;padding:28px 20px 18px;background:#f8fbf9;}
.sketch-stats {display:grid;grid-template-columns:1.25fr 1fr .9fr;gap:9px;}
.sketch-stat {min-width:0;min-height:126px;padding:14px 10px;border-radius:13px;display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;}
.sketch-stat span {font-size:12px;font-weight:800;letter-spacing:.05em;color:#637777;}
.sketch-stat strong {font-size:clamp(21px,2.1vw,34px);line-height:1.15;font-weight:900;
  color:#06402b;overflow-wrap:anywhere;}
.sketch-tip {background:#eaf6ee;}
.sketch-confidence {background:#fff8e6;}
.sketch-score {background:#eaf4fc;}
.sketch-view-prediction {display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;min-height:36px;padding:8px 12px;border:0;border-radius:14px;
  background:linear-gradient(100deg,#e9f8f5,#e3f6f1);color:#08614f;
  text-decoration:none;text-transform:uppercase;font-size:13px;font-weight:800;box-shadow:none;}
.sketch-view-prediction span {display:none;}
.sketch-view-prediction:hover,.sketch-view-prediction:focus-visible {background:#d5efe7;color:#065c35;}
.sketch-view-unavailable {text-align:center;color:#697f81;padding:20px;}
.sketch-favorite {position:absolute;top:4px;right:5px;transform:scale(.8);}
@media(max-width:900px) {
  .sketch-match-card {grid-template-columns:1fr;}
  .sketch-match-left {border-right:0;border-bottom:1px solid #dbe5e2;}
  .sketch-match-right {padding:18px 14px;}
}
/* Super Tips first navigation item and pre-publication preview. */
.main-nav .nav-super-tips {display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 16px;border-radius:10px;background:#065c35;color:#fff !important;font-weight:800;text-decoration:none;}
.main-nav .nav-super-tips span {font-size:19px;}
.day-tabs .super-tips-day-tab {display:flex;align-items:center;justify-content:center;gap:10px;
  background:#065c35 !important;color:#fff !important;border-radius:10px;padding:12px 18px;}
.day-tabs .super-tips-day-tab strong {color:#fff !important;}
.super-tips-preview-notice {padding:44px 24px;text-align:center;background:#fff;border:1px solid #d5e4df;
  border-radius:18px;box-shadow:0 8px 24px rgba(8,45,32,.08);}
.super-tips-stats {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 18px;
  padding:12px;background:#f8fbf9;border:1px solid #d5e4df;border-radius:18px;box-shadow:0 8px 24px rgba(8,45,32,.08);}
.super-tips-stat {display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  min-height:78px;padding:10px 8px;background:#fff;border:1px solid #d5e4df;border-radius:12px;text-align:center;}
.super-tips-stat strong {color:#065c35;font-size:clamp(18px,2vw,27px);line-height:1.1;font-variant-numeric:tabular-nums;}
.super-tips-stat span {color:#61777a;font-size:12px;font-weight:800;}
.super-tips-stat-won strong,.super-tips-stat-rate strong {color:#16834d;}
.super-tips-stat-lost strong {color:#c54343;}
.super-tips-preview-icon {font-size:42px;}
.super-tips-preview-notice h2 {font-size:28px;color:#065c35;margin:10px 0;}
.super-tips-preview-notice p {max-width:570px;margin:12px auto;color:#526e66;line-height:1.55;}
.super-tips-all-link {display:inline-block;margin-top:18px;padding:14px 24px;border-radius:10px;
  background:#f1b51c;color:#102d21 !important;text-decoration:none;font-weight:800;}

@media(max-width:480px) {
  .super-tips-stats {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px;margin-bottom:12px;}
  .super-tips-stat {min-height:68px;padding:8px 5px;}
  .super-tips-stat span {font-size:10px;}
}

/* Compact match cards: approximately half the previous desktop height. */
@media (min-width: 901px) {
  .sketch-match-card { min-height: 130px; }
  .sketch-league { min-height: 30px; padding: 5px 12px; gap: 7px; font-size: 12px; }
  .sketch-flag { width: 34px; height: 25px; }
  .sketch-fixture { min-height: 100px; padding: 7px 10px; gap: 5px; grid-template-columns: minmax(0,1fr) minmax(85px,.85fr) minmax(0,1fr); }
  .sketch-team { gap: 4px; }
  .sketch-team-logo,.sketch-team-logo-placeholder { width: 44px; height: 44px; }
  .sketch-team-logo-placeholder { font-size: 24px; }
  .sketch-team a { font-size: 13px; line-height: 1.15; }
  .sketch-kickoff { min-height: 70px; gap: 3px; }
  .sketch-kickoff span { font-size: 11px; }
  .sketch-kickoff strong { font-size: 23px; }
  .sketch-kickoff small { font-size: 9px; }
  .sketch-match-right { padding: 10px 12px 8px; gap: 8px; }
  .sketch-stats { gap: 6px; }
  .sketch-stat { min-height: 62px; padding: 6px 5px; gap: 4px; border-radius: 8px; }
  .sketch-stat span { font-size: 9px; letter-spacing: 0; }
  .sketch-stat strong { font-size: clamp(13px, 1.35vw, 20px); line-height: 1.1; }
  .sketch-view-prediction { min-height: 36px; font-size: 13px; }
  
  .sketch-favorite { top: 0; right: 1px; transform: scale(.65); }
}

/* Compact, legible match cards on phones and tablets as well as desktop. */
@media (max-width: 900px) {
  .sketch-match-card { min-height: 0; margin-bottom: 10px; border-radius: 12px; }
  .sketch-league { min-height: 30px; padding: 6px 10px; gap: 7px; font-size: 12px; line-height: 1.2; }
  .sketch-flag { width: 34px; height: 25px; }
  .sketch-fixture { min-height: 92px; padding: 8px 10px; gap: 5px; grid-template-columns: minmax(0,1fr) minmax(74px,.75fr) minmax(0,1fr); }
  .sketch-team { gap: 4px; }
  .sketch-team-logo,.sketch-team-logo-placeholder { width: 42px; height: 42px; }
  .sketch-team-logo-placeholder { font-size: 22px; }
  .sketch-team a { font-size: 12px; line-height: 1.2; }
  .sketch-kickoff { min-height: 64px; gap: 3px; }
  .sketch-kickoff span { font-size: 10px; }
  .sketch-kickoff strong { font-size: 21px; }
  .sketch-kickoff small { font-size: 9px; }
  .sketch-match-right { padding: 8px 10px 10px; gap: 7px; }
  .sketch-stats { gap: 6px; }
  .sketch-stat { min-height: 60px; padding: 6px 4px; gap: 4px; border-radius: 8px; }
  .sketch-stat span { font-size: 9px; letter-spacing: 0; }
  .sketch-stat strong { font-size: clamp(13px, 3.5vw, 18px); line-height: 1.15; }
  .sketch-view-prediction { min-height: 38px; font-size: 13px; }
  
  .sketch-favorite { top: 0; right: 1px; transform: scale(.65); }
}
@media (max-width: 360px) {
  .sketch-fixture { grid-template-columns: minmax(0,1fr) 68px minmax(0,1fr); padding-inline: 6px; }
  .sketch-team-logo,.sketch-team-logo-placeholder { width: 36px; height: 36px; }
  .sketch-team a { font-size: 11px; }
  .sketch-stat strong { font-size: 12px; }
}

/* Live score and provider-reported match minute beneath the scheduled kickoff. */
.sketch-kickoff .sketch-live-score {
  display: flex; align-items: center; justify-content: center; gap: 7px;
  margin-top: 3px; padding: 3px 7px; border-radius: 7px;
  background: #e6f6ee; white-space: nowrap;
}
.sketch-kickoff .sketch-live-score[hidden] { display: none; }
.sketch-kickoff .sketch-live-scoreline { color: #065c35; font-size: 15px; font-weight: 900; }
.sketch-kickoff .sketch-live-minute { color: #c52c26; font-size: 11px; font-weight: 800; }
@media (max-width: 900px) {
  .sketch-kickoff .sketch-live-score { gap: 5px; padding: 3px 5px; }
  .sketch-kickoff .sketch-live-scoreline { font-size: 13px; }
  .sketch-kickoff .sketch-live-minute { font-size: 10px; }
}

/* Date and kickoff time use identical typography at every viewport width. */
.sketch-match-card .sketch-kickoff > strong,
.sketch-match-card .sketch-kickoff > a > time > strong,
.sketch-match-card .sketch-kickoff > time > strong {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: 700 !important;
  line-height: inherit !important;
  color: #697f81 !important;
}
.sketch-match-card .sketch-kickoff > a > time > span,
.sketch-match-card .sketch-kickoff > time > span {
  font-size: inherit !important;
  font-weight: 700 !important;
  line-height: inherit !important;
}
.sketch-match-card .sketch-kickoff {
  font-size: 11px;
  line-height: 1.3;
}
@media (max-width: 900px) {
  .sketch-match-card .sketch-kickoff { font-size: 10px; }
}

/* Published Super Tips editions — newest UTC date first. */
.super-tips-edition { margin: 0 0 18px; padding: 15px; border: 1px solid #d5e4df; border-radius: 14px; background: #fff; }
.super-tips-edition h2 { margin: 0 0 5px; color: #065c35; font-size: 20px; }
.super-tips-edition-note { margin: 0 0 12px; color: #61777a; font-size: 12px; }
.super-tips-picks { display: grid; gap: 14px; }
.super-tips-edition .sketch-match-card { margin-bottom: 0; }
@media (max-width: 700px) {
  .super-tips-edition { padding: 10px; }
  .super-tips-edition h2 { font-size: 16px; }
}

/* Strong settled-result highlighting; neutral until a supported tip resolves. */
.sketch-match-card .sketch-stat.sketch-score.sketch-score-won {
  background: #dcfce7 !important;
  border: 2px solid #16a34a !important;
  box-shadow: inset 0 0 0 1px #bbf7d0;
}
.sketch-match-card .sketch-stat.sketch-score.sketch-score-won span,
.sketch-match-card .sketch-stat.sketch-score.sketch-score-won strong {
  color: #166534 !important;
}
.sketch-match-card .sketch-stat.sketch-score.sketch-score-lost {
  background: #fee2e2 !important;
  border: 2px solid #dc2626 !important;
  box-shadow: inset 0 0 0 1px #fecaca;
}
.sketch-match-card .sketch-stat.sketch-score.sketch-score-lost span,
.sketch-match-card .sketch-stat.sketch-score.sketch-score-lost strong {
  color: #991b1b !important;
}

/* Prevent long API-Football tip descriptions from widening match-card columns. */
.sketch-match-card .sketch-stats { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, .9fr); min-width: 0; }
.sketch-match-card .sketch-tip { min-width: 0; overflow: hidden; }
.sketch-match-card .sketch-tip strong {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
  line-clamp: 3; overflow: hidden; max-width: 100%;
  overflow-wrap: anywhere; word-break: normal; hyphens: auto;
  font-size: clamp(10px, 1vw, 13px); line-height: 1.18;
}
.sketch-match-card .sketch-view-prediction {
  position: relative; z-index: 2; pointer-events: auto;
  flex: 0 0 auto; box-sizing: border-box;
}
@media (max-width: 900px) {
  .sketch-match-card .sketch-tip strong { font-size: 12px; }
}