/* OddsQ r79: single-tone stage, compact hero geometry, and stable public grids. */

@media (min-width: 1181px) {
  :root {
    --stage-edge: max(20px, calc((100% - var(--page)) / 2));
    --stage-tone: 142, 137, 124;
    --stage-line: rgba(var(--stage-tone), 0.18);
    --stage-fill: rgba(17, 20, 21, 0.985);
  }

  body {
    background:
      radial-gradient(ellipse at 50% 7%, rgba(var(--stage-tone), 0.045), transparent 34rem),
      linear-gradient(180deg, #050707 0%, #030505 52%, #070909 100%) !important;
  }

  /* One desaturated graphite light source replaces the split blue/gold wash. */
  body::before {
    display: block !important;
    opacity: 1 !important;
    background:
      radial-gradient(ellipse 270px 860px at calc(var(--stage-edge) - 34px) 35%, rgba(var(--stage-tone), 0.12), rgba(var(--stage-tone), 0.035) 48%, transparent 77%),
      radial-gradient(ellipse 270px 860px at calc(100% - var(--stage-edge) + 34px) 35%, rgba(var(--stage-tone), 0.12), rgba(var(--stage-tone), 0.035) 48%, transparent 77%),
      radial-gradient(circle 280px at var(--stage-edge) 96px, rgba(var(--stage-tone), 0.055), transparent 74%),
      radial-gradient(circle 280px at calc(100% - var(--stage-edge)) 96px, rgba(var(--stage-tone), 0.055), transparent 74%) !important;
  }

  body::after {
    right: var(--stage-edge) !important;
    left: var(--stage-edge) !important;
    border: 0 !important;
    background:
      linear-gradient(90deg, rgba(var(--stage-tone), 0.038), transparent 11%, transparent 89%, rgba(var(--stage-tone), 0.038)),
      linear-gradient(180deg, rgba(14, 17, 18, 0.99), rgba(6, 9, 9, 0.995) 50%, rgba(10, 12, 12, 0.995)) !important;
    box-shadow:
      -24px 0 72px rgba(var(--stage-tone), 0.07),
      24px 0 72px rgba(var(--stage-tone), 0.07),
      inset 2px 0 12px rgba(var(--stage-tone), 0.035),
      inset -2px 0 12px rgba(var(--stage-tone), 0.035),
      inset 0 18px 48px rgba(255, 255, 255, 0.011) !important;
  }

  /* The content sits inside the rails, so neither logo nor Telegram can touch them. */
  .site-header {
    padding-right: calc(var(--stage-edge) + 14px) !important;
    padding-left: calc(var(--stage-edge) + 14px) !important;
  }

  .site-header::before,
  .site-header::after {
    top: 9px !important;
    bottom: -45px !important;
    width: 2px !important;
    border-radius: 999px;
    background: linear-gradient(180deg, transparent 0%, rgba(var(--stage-tone), 0.08) 8%, rgba(var(--stage-tone), 0.3) 34%, rgba(var(--stage-tone), 0.2) 78%, transparent 100%) !important;
    box-shadow: 0 0 16px rgba(var(--stage-tone), 0.1) !important;
  }

  body:not(:has(.market-ticker)) .site-header::before,
  body:not(:has(.market-ticker)) .site-header::after {
    bottom: 8px !important;
  }

  .market-ticker {
    border-color: rgba(var(--stage-tone), 0.14) !important;
    border-radius: 0 0 12px 12px;
    background: rgba(5, 8, 8, 0.9) !important;
    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.26) !important;
  }

  .market-ticker::before {
    background:
      linear-gradient(90deg, rgba(var(--stage-tone), 0.055), transparent 15%, transparent 85%, rgba(var(--stage-tone), 0.055)),
      rgba(4, 7, 8, 0.95) !important;
  }

  .dashboard,
  .window-page-shell,
  .about-shell,
  .content-shell {
    background:
      linear-gradient(90deg, rgba(var(--stage-tone), 0.022), transparent 8%, transparent 92%, rgba(var(--stage-tone), 0.022)),
      rgba(7, 10, 10, 0.32);
  }

  .site-footer {
    margin-top: 12px !important;
    border-top-color: rgba(var(--stage-tone), 0.16) !important;
    border-radius: 22px 22px 0 0 !important;
    background:
      radial-gradient(ellipse at 50% 0, rgba(var(--stage-tone), 0.055), transparent 58%),
      linear-gradient(90deg, rgba(var(--stage-tone), 0.03), transparent 15%, transparent 85%, rgba(var(--stage-tone), 0.03)),
      linear-gradient(180deg, rgba(16, 19, 19, 0.99), rgba(6, 9, 9, 0.995)) !important;
    box-shadow: inset 0 1px 0 rgba(var(--stage-tone), 0.12), 0 -14px 38px rgba(0, 0, 0, 0.24) !important;
  }

  /* Homepage hero: denser above the fold without shrinking readable content. */
  .dashboard {
    padding-top: 7px !important;
    padding-bottom: 16px !important;
  }

  .top-grid {
    grid-template-rows: 322px !important;
  }

  .top-grid > .lead-panel,
  .top-grid > .certain-panel,
  .top-grid > .asset-panel {
    height: 322px !important;
    min-height: 322px !important;
    border-radius: 17px !important;
  }

  .lead-panel {
    padding: 14px 17px !important;
  }

  .lead-copy {
    margin-top: 10px !important;
  }

  .lead-title {
    font-size: 21.5px !important;
  }

  .lead-bottom {
    grid-template-columns: minmax(0, 1fr) 184px !important;
    gap: 9px !important;
    padding-top: 8px !important;
  }

  .lead-action {
    width: 184px !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    column-gap: 9px !important;
    padding: 8px 10px !important;
  }

  .lead-action .lead-poly {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    margin: 0 !important;
  }

  .lead-action .lead-poly img {
    width: 25px !important;
    height: 25px !important;
  }

  .lead-action > span:nth-child(2) {
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Headers and their value lanes now terminate at the panel edge. */
  .certain-panel .panel-title,
  .asset-panel .panel-title {
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 0 0 13px !important;
    overflow: hidden;
    border-radius: 16px 16px 0 0;
    background: linear-gradient(90deg, rgba(var(--stage-tone), 0.045), rgba(4, 7, 8, 0.7)) !important;
  }

  .certain-panel .panel-title {
    grid-template-columns: minmax(0, 1fr) 82px !important;
  }

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

  .certain-panel .panel-horizon,
  .asset-panel .panel-horizon {
    display: grid;
    height: 44px;
    align-self: stretch;
    place-items: center;
    margin: 0 !important;
    padding: 0 10px !important;
    border-left: 1px solid rgba(var(--stage-tone), 0.11);
    background: rgba(2, 4, 5, 0.58);
    text-align: center;
  }

  .certain-panel .intel-list,
  .asset-panel .asset-scroll,
  .asset-panel .asset-track,
  .asset-panel .asset-body {
    height: 278px !important;
  }

  .certain-panel .intel-list,
  .asset-panel .asset-body {
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: auto;
    scrollbar-width: none !important;
    touch-action: pan-y;
  }

  .certain-panel .intel-list::-webkit-scrollbar,
  .asset-panel .asset-body::-webkit-scrollbar {
    width: 0;
    height: 0;
  }

  .certain-panel .intel-scroll-sequence,
  .asset-panel .asset-sequence {
    padding-right: 0 !important;
  }

  .certain-panel .intel-row,
  .certain-panel .intel-scroll-track > .intel-row {
    flex-basis: 86px !important;
    height: 86px !important;
    min-height: 86px !important;
    grid-template-columns: minmax(0, 1fr) 82px !important;
    padding: 0 0 0 13px !important;
    overflow: hidden;
    border-radius: 12px 0 0 12px !important;
  }

  .certain-panel .intel-value {
    display: grid;
    height: 100%;
    align-self: stretch;
    place-items: center;
    border-left: 1px solid rgba(var(--stage-tone), 0.1);
    background: rgba(2, 4, 5, 0.5);
    text-align: center;
  }

  .certain-panel .intel-value b {
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
  }

  .asset-panel .asset-rows {
    grid-auto-rows: 50px !important;
  }

  .asset-panel .asset-row,
  .asset-panel .asset-row:nth-child(odd) {
    min-height: 50px !important;
    height: 50px !important;
    grid-template-columns: minmax(0, 1fr) 146px !important;
    padding: 0 !important;
    overflow: hidden;
    border-radius: 11px 0 0 11px !important;
  }

  .asset-panel .asset-identity {
    padding: 5px 10px !important;
  }

  .asset-panel .asset-range-wrap {
    display: grid;
    height: 100%;
    align-self: stretch;
    place-items: center end;
    padding: 0 11px;
    border-left: 1px solid rgba(var(--stage-tone), 0.1);
    background: rgba(2, 4, 5, 0.5);
  }

  /* The market area is one continuous material rather than isolated black gaps. */
  #marketWindows {
    margin-top: 0 !important;
    padding: 0 10px 14px !important;
    border-radius: 18px;
    background:
      linear-gradient(90deg, rgba(var(--stage-tone), 0.024), transparent 8%, transparent 92%, rgba(var(--stage-tone), 0.024)),
      rgba(13, 16, 17, 0.82) !important;
  }

  .primary-window-grid {
    margin: 0 !important;
  }

  .primary-window-grid .window-head {
    height: 50px !important;
    min-height: 50px !important;
  }

  .primary-window-grid .card-list-primary {
    gap: 9px !important;
  }

  .primary-window-grid .market-card {
    height: 184px !important;
    min-height: 184px !important;
  }

  .continuation-stream {
    gap: 12px !important;
    margin-top: 12px !important;
    background: transparent !important;
  }

  .continuation-stream .window-continuation {
    margin: 0 !important;
    padding: 0 0 12px !important;
    border-radius: 16px !important;
    background: rgba(15, 18, 19, 0.72) !important;
  }

  .continuation-stream .card-list-more {
    padding: 0 10px !important;
  }

  .reserved-card,
  .window-slot-empty {
    border-style: dashed !important;
    border-color: rgba(var(--stage-tone), 0.13) !important;
    background:
      radial-gradient(circle at 50% 0, rgba(var(--stage-tone), 0.035), transparent 10rem),
      rgba(14, 17, 18, 0.76) !important;
    box-shadow: inset 0 1px 0 rgba(var(--stage-tone), 0.045) !important;
  }

  .window-slot-empty .card-title,
  .reserved-card .card-title {
    color: rgba(222, 226, 223, 0.58) !important;
  }

  .window-slot-empty .card-tags,
  .window-slot-empty .card-change,
  .window-slot-empty .card-meta,
  .reserved-card .card-tags,
  .reserved-card .card-change,
  .reserved-card .card-meta {
    color: rgba(190, 198, 194, 0.38) !important;
  }

  /* Market Moves: stable title/switcher/count row and a fixed 5x3 grid. */
  .view-all-page {
    scroll-padding-top: 142px;
  }

  .view-all-page .window-page-shell {
    padding-top: 10px !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .view-all-page .window-page-hero {
    position: sticky;
    z-index: 8;
    top: 70px;
    display: grid !important;
    min-height: 58px !important;
    grid-template-columns: 220px minmax(0, 1fr) 142px !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid rgba(var(--stage-tone), 0.13);
    background: rgba(8, 11, 11, 0.96);
    backdrop-filter: blur(12px);
  }

  .view-all-page .window-page-hero > div:first-child {
    min-width: 0 !important;
  }

  .view-all-page .window-page-hero h1 {
    margin: 0 !important;
    font-size: 21.5px !important;
    line-height: 1.08 !important;
    white-space: nowrap;
  }

  .view-all-page .window-page-notes-inline {
    display: block !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

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

  .view-all-page .window-page-notes-inline .window-switcher a {
    width: 100% !important;
    min-width: 0 !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 6px !important;
    border-radius: 12px !important;
  }

  .view-all-page .window-page-hero .window-count-pill {
    width: 142px;
    justify-self: end;
    margin: 0 !important;
    text-align: center;
    white-space: nowrap;
  }

  .view-all-page .window-filter-row {
    display: block !important;
    margin: 8px 0 10px !important;
  }

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

  .view-all-page .window-category-filters button {
    min-height: 42px !important;
    padding: 8px 10px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
  }

  .view-all-page .window-market-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
    min-height: 554px;
    margin: 0 !important;
  }

  .view-all-page .window-market-grid .market-card {
    height: 178px !important;
    min-height: 178px !important;
  }

  .view-all-page .window-policy {
    margin-top: 14px !important;
    border-radius: 17px !important;
  }
}

@media (min-width: 1181px) and (max-width: 1480px) {
  body::before {
    background: none !important;
  }

  .view-all-page .window-page-hero {
    grid-template-columns: 175px minmax(0, 1fr) 132px !important;
  }

  .view-all-page .window-page-hero h1 {
    font-size: 20px !important;
  }
}

@media (max-width: 1180px) {
  .view-all-page .window-page-hero h1 {
    font-size: 21.5px !important;
    line-height: 1.08 !important;
  }

  .view-all-page .window-page-hero .window-count-pill {
    display: inline-flex;
    margin-top: 8px;
  }

  .view-all-page .window-market-grid .window-slot-empty {
    min-height: 150px;
  }
}
