.games-clocks {
  --clock-ink: #edf6ef;
  --clock-soft: #c1d8cf;
  background: #0d3737;
  color: var(--clock-ink);
  padding: 15px max(16px, calc((100% - min(1400px, 92%)) / 2)) 10px;
  font-family: var(--sans, "Segoe UI", sans-serif);
}
.clock-inner {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.games-clock {
  --clock-accent: #c0ecc5;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: clamp(12px, 1.7vw, 24px);
  border: 1px solid #71958b66;
  border-radius: 10px;
  background: linear-gradient(114deg, #1b4c47, #173e3d);
}
.games-clock::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  inset: 0;
  opacity: .28;
  background: repeating-radial-gradient(ellipse at -12% 130%, transparent 0 22px, #86ae9638 23px 24px, transparent 25px 34px);
  mask-image: linear-gradient(80deg, black, transparent 72%);
}
.clock-1 {
  --clock-accent: #ffc68f;
  background: linear-gradient(114deg, #28463c, #203c38);
}
.clock-label strong, .clock-label span, .clock-part b, .clock-part small { display: block; }
.clock-label strong { color: var(--clock-accent); font-size: clamp(16px, 1.65vw, 26px); font-weight: 650; line-height: 1.15; letter-spacing: -.025em; }
.clock-label span { color: var(--clock-soft); font-size: 12px; margin-top: 5px; }
.clock-values { display: flex; align-items: center; gap: clamp(8px, 1.5vw, 25px); }
.clock-part { text-align: center; }
.clock-part b { font-size: clamp(28px, 3vw, 46px); line-height: 1; font-weight: 600; letter-spacing: -.065em; font-variant-numeric: tabular-nums; }
.clock-part small { margin-top: 3px; font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--clock-soft); }
.clock-state { color: var(--clock-accent); font-size: 18px; }
.clock-note { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 3px 16px; margin-top: 8px; color: var(--clock-soft); font-size: 11px; line-height: 1.4; }
.clock-note b { color: var(--clock-ink); font-weight: 600; }
.inside-freshness { text-align: right; padding-block: 8px 0; color: #4c665b; font-size: 12px; }
.inside-freshness b { font-weight: 600; }
body[data-view-section="home"] .games-clocks { padding-block: 5px; }
body[data-view-section="home"] .games-clock { display: flex; padding: 3px 10px; border: 0; border-radius: 3px; }
body[data-view-section="home"] .clock-label strong { font-size: clamp(12px, 1.2vw, 17px); }
body[data-view-section="home"] .clock-label span { font-size: 10px; margin-top: 1px; }
body[data-view-section="home"] .clock-values { gap: 8px; margin: 0; }
body[data-view-section="home"] .clock-part b { font-size: clamp(16px, 1.8vw, 25px); }
body[data-view-section="home"] .clock-part small { font-size: 8px; margin: 0; }
body[data-view-section="home"] .clock-note { margin-top: 3px; }
@media (max-width: 600px) {
  body[data-view-section="home"] .games-clock { display: grid; grid-template-columns: 1fr; gap: 3px; }
  body[data-view-section="home"] .clock-label span { display: none; }
  body[data-view-section="home"] .clock-part { display: flex; align-items: baseline; gap: 2px; }
  body[data-view-section="home"] .clock-note > span:first-child { display: none; }
}
@media (max-width: 880px) {
  .games-clock { display: block; }
  .clock-values { justify-content: flex-start; margin-top: 10px; gap: 15px; }
  .clock-label span { font-size: 11px; }
}
@media (max-width: 500px) {
  .games-clocks { padding: 10px 12px 8px; }
  .clock-inner { gap: 7px; }
  .games-clock { padding: 11px 8px; }
  .clock-label strong { font-size: clamp(14px, 3.7vw, 18px); }
  .clock-label span, .clock-note { font-size: 10px; }
  .clock-values { gap: 9px; }
  .clock-part b { font-size: clamp(19px, 5.7vw, 28px); }
  .clock-part small { font-size: 8px; }
  .inside-freshness { text-align: left; }
}