/* OddsQ r80: Home geometry and Market Moves control hierarchy. */

:root {
  --r80-surface: rgba(24, 29, 31, 0.985);
  --r80-surface-soft: rgba(20, 25, 27, 0.94);
  --r80-surface-deep: rgba(11, 15, 16, 0.9);
  --r80-line: rgba(190, 194, 185, 0.16);
  --r80-line-strong: rgba(204, 207, 198, 0.23);
  --r80-highlight: rgba(255, 255, 255, 0.055);
}

@media (min-width: 1181px) {
  /* Home: one aligned, softly raised desktop stage. */
  .dashboard .top-grid {
    gap: 12px !important;
    grid-template-columns: 2fr 1.5fr 1.5fr !important;
  }

  .dashboard .top-grid > .lead-panel,
  .dashboard .top-grid > .certain-panel,
  .dashboard .top-grid > .asset-panel {
    overflow: hidden;
    border-color: var(--r80-line-strong) !important;
    border-radius: 20px !important;
    background:
      radial-gradient(circle at 92% 2%, rgba(255, 255, 255, 0.065), transparent 230px),
      linear-gradient(145deg, rgba(255, 255, 255, 0.035), transparent 42%),
      var(--r80-surface) !important;
    box-shadow:
      inset 0 1px 0 var(--r80-highlight),
      inset 0 -1px 0 rgba(0, 0, 0, 0.38),
      0 14px 34px rgba(0, 0, 0, 0.24) !important;
  }

  .dashboard .certain-panel .panel-title,
  .dashboard .asset-panel .panel-title {
    border-radius: 18px 18px 12px 12px !important;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.015)),
      rgba(21, 26, 28, 0.96) !important;
  }

  .dashboard .certain-panel .panel-horizon,
  .dashboard .asset-panel .panel-horizon,
  .dashboard .certain-panel .intel-value,
  .dashboard .asset-panel .asset-range-wrap {
    background: var(--r80-surface-deep) !important;
  }

  .dashboard .certain-panel .intel-row,
  .dashboard .certain-panel .intel-scroll-track > .intel-row,
  .dashboard .asset-panel .asset-row,
  .dashboard .asset-panel .asset-row:nth-child(odd) {
    border-color: rgba(214, 217, 208, 0.12) !important;
    background:
      linear-gradient(90deg, rgba(255, 255, 255, 0.035), transparent 66%),
      rgba(22, 27, 29, 0.92) !important;
  }

  .dashboard .certain-panel .intel-row,
  .dashboard .certain-panel .intel-scroll-track > .intel-row {
    border-radius: 14px !important;
  }

  .dashboard .asset-panel .asset-row,
  .dashboard .asset-panel .asset-row:nth-child(odd) {
    border-radius: 13px !important;
  }

  /* The loop controller also handles the wheel, so desktop no longer freezes. */
  .dashboard .certain-panel .intel-list,
  .dashboard .asset-panel .asset-body {
    overflow: hidden !important;
    overscroll-behavior: contain !important;
    touch-action: pan-y;
  }

  .dashboard .certain-panel .intel-scroll-track.is-looping,
  .dashboard .asset-panel .asset-rows.is-scrolling.is-looping {
    animation: none !important;
    transform: translate3d(0, calc(0px - var(--loop-offset, 0px)), 0) !important;
    will-change: transform !important;
  }

  .dashboard .certain-panel .intel-scroll-sequence[data-loop-clone],
  .dashboard .asset-panel .asset-sequence[data-loop-clone] {
    display: flex !important;
    flex-direction: column !important;
  }

  .dashboard #marketWindows {
    margin-top: 8px !important;
    padding: 0 0 16px !important;
    border: 1px solid rgba(205, 208, 199, 0.11);
    border-radius: 20px !important;
    background:
      radial-gradient(ellipse at 50% 0, rgba(255, 255, 255, 0.035), transparent 45%),
      linear-gradient(90deg, rgba(255, 255, 255, 0.02), transparent 9%, transparent 91%, rgba(255, 255, 255, 0.02)),
      var(--r80-surface-soft) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035), 0 14px 34px rgba(0, 0, 0, 0.2);
  }

  .dashboard .primary-window-grid {
    width: 100% !important;
  }

  .dashboard .primary-window-grid::before {
    height: 50px !important;
    border-color: var(--r80-line) !important;
    border-radius: 18px !important;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.008)),
      rgba(18, 23, 25, 0.98) !important;
  }

  .dashboard .primary-window-grid .market-card {
    height: 192px !important;
    min-height: 192px !important;
    overflow: hidden !important;
    border-radius: 17px !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.058), transparent 56%),
      rgba(26, 31, 33, 0.985) !important;
  }

  .dashboard .primary-window-grid .market-card > * {
    min-height: 0;
  }

  .dashboard .primary-window-grid .market-card .card-metrics,
  .dashboard .primary-window-grid .market-card .card-meta,
  .dashboard .primary-window-grid .market-card .card-timing {
    flex-shrink: 0 !important;
  }

  .dashboard .primary-window-grid .market-card .card-timing {
    display: flex !important;
    min-height: 13px !important;
    align-items: center;
    line-height: 13px !important;
  }

  .dashboard .continuation-stream {
    padding: 0 10px;
  }

  /* Market Moves: time is primary navigation; topics are secondary filters. */
  .view-all-page .window-page-shell {
    padding: 12px 14px 20px !important;
    border-radius: 24px;
    background:
      radial-gradient(ellipse at 50% 0, rgba(255, 255, 255, 0.045), transparent 38rem),
      linear-gradient(90deg, rgba(255, 255, 255, 0.024), transparent 10%, transparent 90%, rgba(255, 255, 255, 0.024)),
      rgba(17, 22, 24, 0.76) !important;
  }

  .view-all-page .window-page-hero {
    top: 76px !important;
    min-height: 70px !important;
    grid-template-columns: 210px minmax(0, 1fr) 150px !important;
    gap: 16px !important;
    padding: 10px 14px !important;
    border: 1px solid var(--r80-line) !important;
    border-radius: 20px !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 52%),
      rgba(24, 29, 31, 0.97) !important;
    box-shadow: inset 0 1px 0 var(--r80-highlight), 0 12px 26px rgba(0, 0, 0, 0.26) !important;
  }

  .view-all-page .window-page-eyebrow {
    color: rgba(204, 210, 206, 0.64) !important;
    font-size: 9px !important;
    letter-spacing: 0.13em !important;
    text-transform: uppercase;
  }

  .view-all-page .window-page-hero h1 {
    margin-top: 3px !important;
    font-size: 21.5px !important;
  }

  .view-all-page .window-page-notes-inline {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 11px !important;
  }

  .view-all-page .window-switcher-label,
  .view-all-page .window-filter-label {
    color: rgba(202, 208, 204, 0.57);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .view-all-page .window-switcher {
    gap: 5px !important;
    padding: 4px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 15px;
    background: rgba(8, 12, 13, 0.58);
  }

  .view-all-page .window-page-notes-inline .window-switcher a {
    height: 34px !important;
    min-height: 34px !important;
    border-color: transparent !important;
    border-radius: 11px !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .view-all-page .window-page-notes-inline .window-switcher a b {
    color: rgba(232, 235, 232, 0.7) !important;
    font-size: 11px !important;
    letter-spacing: 0 !important;
  }

  .view-all-page .window-page-notes-inline .window-switcher a.active {
    border-color: rgba(241, 201, 40, 0.34) !important;
    background: linear-gradient(180deg, rgba(241, 201, 40, 0.14), rgba(241, 201, 40, 0.045)) !important;
    box-shadow: inset 0 1px 0 rgba(255, 230, 112, 0.12), 0 4px 10px rgba(0, 0, 0, 0.2) !important;
  }

  .view-all-page .window-page-notes-inline .window-switcher a.active b {
    color: #f1c928 !important;
  }

  .view-all-page .window-page-hero .window-count-pill {
    width: auto !important;
    min-width: 136px;
    padding: 10px 14px !important;
    border-radius: 999px !important;
    background: rgba(10, 14, 15, 0.72) !important;
  }

  .view-all-page .window-filter-row {
    margin: 9px 0 11px !important;
  }

  .view-all-page .window-category-filters {
    display: flex !important;
    min-height: 48px;
    align-items: center;
    gap: 7px !important;
    padding: 7px 10px;
    border: 1px solid rgba(205, 208, 199, 0.11);
    border-radius: 18px;
    background: rgba(20, 25, 27, 0.82);
  }

  .view-all-page .window-category-filters button {
    width: auto !important;
    min-width: 0 !important;
    min-height: 32px !important;
    padding: 6px 12px !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.025) !important;
    box-shadow: none !important;
  }

  .view-all-page .window-category-filters button.active {
    border-color: rgba(241, 201, 40, 0.3) !important;
    background: rgba(241, 201, 40, 0.095) !important;
  }

  .view-all-page .window-market-grid {
    gap: 10px !important;
  }

  .view-all-page .window-market-grid .market-card {
    height: 202px !important;
    min-height: 202px !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.06), transparent 58%),
      rgba(27, 32, 34, 0.985) !important;
  }

  .view-all-page .window-market-grid .market-card .card-timing {
    flex: 0 0 13px !important;
    min-height: 13px !important;
    line-height: 13px !important;
  }

  .view-all-page .window-policy {
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.035), transparent 54%),
      rgba(22, 27, 29, 0.92) !important;
  }
}

@media (max-width: 1180px) {
  .view-all-page .window-page-notes-inline {
    display: grid !important;
    gap: 7px !important;
  }

  .view-all-page .window-switcher-label,
  .view-all-page .window-filter-label {
    display: block;
    margin-bottom: 6px;
    color: rgba(202, 208, 204, 0.58);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.11em;
    text-transform: uppercase;
  }

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

  .view-all-page .window-page-notes-inline .window-switcher a {
    min-width: 0 !important;
    padding: 7px 4px !important;
    border-radius: 10px !important;
  }

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

  .view-all-page .window-category-filters {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    padding: 8px;
    border-radius: 16px;
    overflow-x: visible !important;
  }

  .view-all-page .window-category-filters .window-filter-label {
    flex: 0 0 100%;
    margin-bottom: 1px;
  }

  .view-all-page .window-category-filters button {
    width: auto !important;
    min-height: 34px !important;
    padding: 7px 10px !important;
    border-radius: 999px !important;
  }
}