/* OddsQ experience r68: precise motion, finished controls, and unified market surfaces. */
:root {
  --r68-edge: rgba(255, 255, 255, 0.2);
  --r68-inner-edge: rgba(255, 255, 255, 0.11);
  --r68-card: rgba(22, 27, 30, 0.97);
  --r68-card-line: rgba(255, 255, 255, 0.13);
}

/* Carry the API/About texture into the market surface without changing layout. */
#marketWindows,
.view-all-page .window-market-grid {
  position: relative;
  isolation: isolate;
}

#marketWindows::before,
.view-all-page .window-market-grid::before {
  position: absolute;
  z-index: 0;
  inset: -12px;
  border-radius: 22px;
  content: "";
  background-image:
    radial-gradient(rgba(255, 255, 255, 0.075) 0.55px, transparent 0.55px),
    radial-gradient(circle at 50% 0, rgba(241, 201, 40, 0.035), transparent 42%);
  background-position: 0 0, center;
  background-size: 8px 8px, 100% 100%;
  opacity: 0.42;
  pointer-events: none;
}

#marketWindows > *,
.view-all-page .window-market-grid > * {
  position: relative;
  z-index: 1;
}

/* One brighter card surface across hero, continuation, and full-window pages. */
.primary-window-grid .market-card,
.card-list-more .market-card,
.view-all-page .window-market-grid .market-card {
  border-color: var(--r68-card-line) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012) 52%, transparent 72%),
    var(--r68-card) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 8px 22px rgba(0, 0, 0, 0.16) !important;
}

.primary-window-grid .market-card:hover,
.card-list-more .market-card:hover,
.view-all-page .window-market-grid .market-card:hover {
  border-color: rgba(241, 201, 40, 0.34) !important;
  background:
    linear-gradient(145deg, rgba(241, 201, 40, 0.065), rgba(255, 255, 255, 0.018) 56%, transparent 74%),
    rgba(24, 30, 32, 0.99) !important;
}

/* Fine continuous rims replace the blunt, detached button edges. */
.market-card .card-source-button,
.lead-action,
.view-all,
.view-all-page .window-switcher a,
.view-all-page .window-category-filters button {
  border: 1px solid var(--r68-edge) !important;
  background-clip: padding-box !important;
}

.market-card .card-source-button::before,
.lead-action::before,
.view-all::before,
.view-all-page .window-switcher a::before,
.view-all-page .window-category-filters button::before {
  position: absolute;
  z-index: 2;
  inset: 1px;
  border: 1px solid var(--r68-inner-edge);
  border-radius: inherit;
  content: "";
  pointer-events: none;
}

/* A true 25% source-control increase: 37px to 46px. */
.market-card .card-metrics .card-source-button {
  width: 46px !important;
  height: 46px !important;
  flex: 0 0 46px !important;
  margin-right: 34px;
  border-radius: 13px !important;
}

.market-card .card-source-button img {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain;
}

.market-card .card-source-button.source-kalshi img {
  width: 30px !important;
  height: 30px !important;
}

.market-card .card-source-button.source-polymarket {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -2px 0 rgba(2, 28, 66, 0.72),
    0 3px 0 #052959,
    0 10px 21px rgba(25, 111, 226, 0.25) !important;
}

.market-card .card-source-button.source-kalshi {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    inset 0 -2px 0 rgba(1, 69, 49, 0.65),
    0 3px 0 #03583f,
    0 10px 21px rgba(9, 216, 150, 0.2) !important;
}

@media (hover: hover) and (pointer: fine) {
  .market-card .card-metrics .card-source-button:hover {
    transform: translateY(-2px) !important;
  }
}

.market-card .card-metrics .card-source-button:active {
  transform: translateY(2px) !important;
}

/* Top Story gets one solid venue control, with no detached arrow treatment. */
.lead-action {
  grid-template-columns: 40px minmax(0, 1fr) !important;
  min-width: 212px;
  min-height: 57px;
  padding: 8px 14px !important;
  border-radius: 15px !important;
}

.lead-action > span:nth-child(2) {
  min-width: 0;
  gap: 2px;
}

.lead-action b {
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em;
}

.lead-action small {
  font-size: 10px !important;
  font-weight: 650 !important;
  letter-spacing: -0.015em;
}

.lead-action .lead-poly {
  width: 39px !important;
  height: 39px !important;
  border-radius: 11px !important;
}

.lead-action .lead-poly img {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain;
}

.lead-action.source-kalshi .lead-poly img {
  width: 30px !important;
  height: 30px !important;
}

.lead-action i {
  display: none !important;
}

/* View All grows slightly while retaining the same information hierarchy. */
.view-all,
.primary-window-grid .view-all,
.continuation-stream .continuation-window-head .view-all {
  min-height: 38px !important;
  padding: 0 15px !important;
  border-radius: 12px !important;
  font-size: 11.5px !important;
  font-weight: 750 !important;
  letter-spacing: -0.02em;
  text-transform: none;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    inset 0 -1px 0 rgba(0, 0, 0, 0.46),
    0 2px 0 rgba(0, 0, 0, 0.5),
    0 7px 15px rgba(0, 0, 0, 0.3) !important;
}

/* Every continuation group now has both an opening and a closing rule. */
.continuation-stream .window-continuation {
  padding-bottom: 23px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
}

.view-all-page .window-switcher a,
.view-all-page .window-category-filters button {
  border-radius: 12px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.42),
    0 2px 0 rgba(0, 0, 0, 0.46),
    0 7px 15px rgba(0, 0, 0, 0.25) !important;
}

@media (max-width: 780px) {
  .market-card .card-metrics .card-source-button {
    margin-right: 14px;
  }

  .lead-action {
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .market-card .card-source-button::after,
  .lead-action::after,
  .view-all::after,
  .view-all-page .window-switcher a::after,
  .view-all-page .window-category-filters button::after {
    display: none;
  }
}