/* OddsQ experience r67: circular rails, aligned data lanes, and tactile controls. */
:root {
  --control-line: rgba(255, 255, 255, 0.18);
  --control-highlight: rgba(255, 255, 255, 0.14);
  --control-shadow: rgba(0, 0, 0, 0.42);
}

/* One scrolling model owns both companion panels. */
.certain-panel .intel-list,
.asset-panel .asset-body {
  scroll-behavior: auto !important;
  overscroll-behavior-y: none;
}

.certain-panel .intel-scroll-track,
.asset-panel .asset-rows.is-scrolling {
  display: flex !important;
  height: auto !important;
  flex-direction: column !important;
  animation: none !important;
  transform: none !important;
  will-change: auto !important;
}

.certain-panel .intel-scroll-sequence,
.asset-panel .asset-sequence {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
}

/* Header dividers and row dividers share exactly the same column tracks. */
.certain-panel .panel-title,
.certain-panel .intel-row {
  grid-template-columns: minmax(0, 1fr) 90px !important;
  gap: 0 !important;
}

.asset-panel .panel-title,
.asset-panel .asset-row {
  grid-template-columns: minmax(0, 1fr) 143px !important;
  gap: 0 !important;
}

.certain-panel .panel-title,
.asset-panel .panel-title {
  padding: 0 10px 0 0 !important;
}

.certain-panel .panel-title > span,
.asset-panel .panel-title > span {
  min-width: 0;
  padding-left: 16px;
}

.certain-panel .panel-horizon,
.asset-panel .panel-horizon {
  align-self: stretch;
  display: grid;
  min-width: 0;
  place-items: center;
  padding: 0 10px;
  border-left: 1px solid rgba(255, 255, 255, 0.085);
  text-align: center;
}

.certain-panel .intel-row,
.asset-panel .asset-row {
  padding: 0 !important;
}

.certain-panel .intel-copy {
  padding: 15px 16px;
}

.certain-panel .intel-value,
.asset-panel .asset-range-wrap {
  align-self: stretch;
  display: grid;
  min-width: 0;
  place-items: center;
  padding: 8px 10px;
  border-left: 1px solid rgba(255, 255, 255, 0.075);
  text-align: center;
}

.asset-panel .asset-identity {
  min-width: 0;
  padding: 9px 12px 9px 16px;
}

/* Shared button construction: inset highlight, physical base, restrained shine. */
.market-card .card-source-button,
.lead-action,
.view-all,
.view-all-page .window-switcher a,
.view-all-page .window-category-filters button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: var(--control-line) !important;
  box-shadow:
    inset 0 1px 0 var(--control-highlight),
    inset 0 -1px 0 rgba(0, 0, 0, 0.42),
    0 3px 0 rgba(0, 0, 0, 0.48),
    0 9px 19px var(--control-shadow) !important;
  transition:
    transform 140ms ease,
    border-color 140ms ease,
    color 140ms ease,
    background 140ms ease,
    box-shadow 140ms ease !important;
}

.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 {
  position: absolute;
  top: 0;
  left: -55%;
  width: 42%;
  height: 100%;
  content: "";
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.16), transparent);
  transform: skewX(-18deg);
  transition: left 300ms ease;
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  .market-card .card-source-button:hover,
  .lead-action:hover,
  .view-all:hover,
  .view-all-page .window-switcher a:hover,
  .view-all-page .window-category-filters button:hover {
    transform: translateY(-2px) !important;
  }

  .market-card .card-source-button:hover::after,
  .lead-action:hover::after,
  .view-all:hover::after,
  .view-all-page .window-switcher a:hover::after,
  .view-all-page .window-category-filters button:hover::after {
    left: 118%;
  }
}

.market-card .card-source-button:active,
.lead-action:active,
.view-all:active,
.view-all-page .window-switcher a:active,
.view-all-page .window-category-filters button:active {
  transform: translateY(2px) !important;
  box-shadow:
    inset 0 2px 5px rgba(0, 0, 0, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 1px 0 rgba(0, 0, 0, 0.56),
    0 4px 9px rgba(0, 0, 0, 0.3) !important;
}

.market-card .card-metrics .card-source-button {
  width: 37px;
  height: 37px;
  flex: 0 0 37px;
  margin-right: 34px;
  border-radius: 11px;
  transform: none !important;
}

.market-card .card-source-button.source-polymarket {
  background: linear-gradient(155deg, #197ce9 0%, #0c4eaa 56%, #073778 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    inset 0 -1px 0 rgba(0, 0, 0, 0.42),
    0 3px 0 #06295c,
    0 9px 19px rgba(25, 111, 226, 0.25) !important;
}

.market-card .card-source-button.source-kalshi {
  background: linear-gradient(155deg, #12dfa1 0%, #05aa7b 58%, #057455 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -1px 0 rgba(0, 0, 0, 0.38),
    0 3px 0 #035a42,
    0 9px 19px rgba(9, 216, 150, 0.2) !important;
}

.lead-action {
  min-width: 192px;
  min-height: 52px;
  border-radius: 13px;
  background:
    radial-gradient(circle at 16% -20%, rgba(255, 255, 255, 0.25), transparent 45%),
    linear-gradient(155deg, #247ff0 0%, #1158bf 58%, #0a3d87 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -1px 0 rgba(0, 0, 0, 0.45),
    0 4px 0 #062d65,
    0 13px 28px rgba(29, 103, 218, 0.28) !important;
}

.lead-action.source-kalshi {
  background:
    radial-gradient(circle at 16% -20%, rgba(255, 255, 255, 0.28), transparent 45%),
    linear-gradient(155deg, #12dfa1 0%, #08a978 60%, #057051 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.25),
    inset 0 -1px 0 rgba(0, 0, 0, 0.4),
    0 4px 0 #03543d,
    0 13px 28px rgba(9, 216, 150, 0.2) !important;
}

.lead-action i {
  display: grid;
  width: 21px;
  height: 21px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.14);
}

.window-label em,
.view-all {
  font-size: 10.5px !important;
}

.view-all {
  min-height: 34px;
  padding: 0 13px !important;
  border-radius: 10px !important;
  color: #edf0ec !important;
  background: linear-gradient(180deg, #252c2f 0%, #171c1e 100%) !important;
  font-weight: 700 !important;
}

.view-all:hover {
  border-color: rgba(241, 201, 40, 0.5) !important;
  color: #ffe34a !important;
  background: linear-gradient(180deg, #303632 0%, #1b211f 100%) !important;
}

.continuation-window-head .window-label em {
  color: var(--muted-strong);
  letter-spacing: 0;
  text-transform: none;
}

/* Market Moves: one continuous inventory and a full-width five-window control. */
.view-all-page .window-page-notes-inline {
  grid-template-columns: minmax(88px, auto) minmax(0, 1fr) !important;
}

.view-all-page .window-page-notes-inline .window-switcher {
  display: grid !important;
  width: 100% !important;
  grid-template-columns: repeat(5, minmax(68px, 1fr)) !important;
  gap: 8px !important;
}

.view-all-page .window-page-notes-inline .window-switcher a {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  height: 42px !important;
  place-items: center !important;
  padding: 0 10px !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #20272a 0%, #111618 100%) !important;
}

.view-all-page .window-page-notes-inline .window-switcher a b {
  font-size: 13px !important;
  font-weight: 750 !important;
}

.view-all-page .window-page-notes-inline .window-switcher a.active {
  border-color: rgba(87, 225, 146, 0.68) !important;
  background:
    radial-gradient(circle at 50% 0, rgba(87, 225, 146, 0.16), transparent 62%),
    linear-gradient(180deg, #173026 0%, #101b16 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 3px 0 #07110c,
    0 8px 18px rgba(37, 191, 111, 0.14) !important;
}

.view-all-page .window-category-filters button {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.02)) !important;
}

.view-all-page .window-category-filters button.active {
  border-color: rgba(178, 255, 89, 0.42) !important;
  background: linear-gradient(180deg, rgba(178, 255, 89, 0.14), rgba(178, 255, 89, 0.055)) !important;
}

@media (max-width: 780px) {
  .certain-panel .panel-title,
  .asset-panel .panel-title {
    padding-right: 7px !important;
  }

  .market-card .card-metrics .card-source-button {
    margin-right: 14px;
  }

  .asset-panel .panel-title,
  .asset-panel .asset-row {
    grid-template-columns: minmax(0, 1fr) minmax(126px, 0.9fr) !important;
  }
}

@media (max-width: 600px) {
  .view-all-page .window-page-notes-inline {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .view-all-page .window-page-notes-inline .window-switcher {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 5px !important;
  }

  .view-all-page .window-page-notes-inline .window-switcher a {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 4px !important;
  }

  .view-all-page .window-page-notes-inline .window-switcher a b {
    font-size: 11px !important;
  }
}

@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;
  }
}