/* PACK09M: compact, location-led public Rubber Market board. */
.rubber-page-hero--market {
  min-height: auto;
  padding-block: clamp(4.75rem,8vw,7rem) clamp(2.75rem,5vw,4.5rem);
}

.rubber-page-hero--market .rubber-lede {
  max-width: 54rem;
}

.rubber-market-state {
  padding-block: clamp(3rem,5vw,5rem);
}

.market-board-summary {
  display: grid;
  grid-template-columns: minmax(17rem,.85fr) minmax(34rem,1.15fr);
  gap: clamp(1.5rem,3vw,3rem);
  align-items: end;
  padding: clamp(1.3rem,2.4vw,2rem);
  border: 1px solid rgba(169,184,162,.2);
  background:
    radial-gradient(circle at 94% 12%,rgba(169,184,162,.09),transparent 35%),
    rgba(255,255,255,.025);
}

.market-board-summary__heading h2 {
  max-width: 18ch;
  margin: .35rem 0 .65rem;
  font-size: clamp(2rem,3.6vw,3.35rem);
  line-height: .98;
}

.market-board-summary__heading > p:last-child {
  max-width: 48rem;
  margin: 0;
  color: var(--rubber-muted);
  font-size: .82rem;
  line-height: 1.55;
}

.market-board-summary__meta {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  margin: 0;
  border-top: 1px solid var(--rubber-line);
  border-left: 1px solid var(--rubber-line);
}

.market-board-summary__meta > div {
  min-width: 0;
  padding: .82rem .8rem;
  border-right: 1px solid var(--rubber-line);
  border-bottom: 1px solid var(--rubber-line);
}

.market-board-summary__meta dt,
.market-location-panel__meta dt {
  color: var(--rubber-muted);
  font-size: .56rem;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1.3;
  text-transform: uppercase;
}

.market-board-summary__meta dd,
.market-location-panel__meta dd {
  margin: .32rem 0 0;
  color: var(--rubber-accent-bright);
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.market-board-summary__meta a,
.market-location-panel__footer > a {
  color: inherit;
  text-decoration-color: rgba(169,184,162,.42);
  text-underline-offset: .22em;
}

.market-board-summary__meta a:hover,
.market-board-summary__meta a:focus-visible,
.market-location-panel__footer > a:hover,
.market-location-panel__footer > a:focus-visible {
  color: #fff;
  text-decoration-color: currentColor;
}

.market-status-chip {
  display: inline-flex;
  align-items: center;
  gap: .43rem;
  color: var(--rubber-muted);
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .012em;
  line-height: 1.35;
}

.market-status-chip::before {
  flex: 0 0 auto;
  width: .38rem;
  height: .38rem;
  border-radius: 50%;
  background: var(--rubber-accent-bright);
  box-shadow: 0 0 0 .18rem rgba(169,184,162,.09);
  content: '';
}

.market-status-chip--delayed::before,
.market-status-chip--error::before,
.market-status-chip--unverified::before,
.market-status-chip--stale::before,
.market-status-chip--mixed::before {
  background: #e0b26f;
  box-shadow: 0 0 0 .18rem rgba(224,178,111,.09);
}

.market-controls {
  gap: .65rem 1.1rem;
  margin: 1rem 0 0;
  padding: .8rem 1rem;
  background: rgba(255,255,255,.018);
}

.market-controls label {
  min-height: 2rem;
  padding: .35rem .62rem;
  font-size: .68rem;
}

.market-controls .button {
  min-height: 2.15rem;
  padding: .45rem .8rem;
  font-size: .66rem;
}

.market-reference-group {
  margin-top: clamp(1.65rem,3.5vw,2.8rem);
}

.market-reference-group:first-of-type {
  margin-top: 1.75rem;
}

.market-reference-group__heading {
  margin-bottom: .8rem;
  padding-bottom: .68rem;
}

.market-reference-group__heading h3 {
  margin-top: .2rem;
  font-size: clamp(1.55rem,2.6vw,2.35rem);
}

.market-reference-group__heading > span {
  color: var(--rubber-muted);
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .045em;
}

.market-location-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: .9rem;
  align-items: start;
}

.market-location-panel {
  min-width: 0;
  padding: clamp(1.05rem,1.8vw,1.45rem);
  border: 1px solid rgba(169,184,162,.2);
  background:
    linear-gradient(145deg,rgba(169,184,162,.035),transparent 48%),
    #0e1614;
  box-shadow: 0 .8rem 2.2rem rgba(0,0,0,.1);
}

.market-location-panel--priority {
  border-color: rgba(209,218,203,.32);
  background:
    linear-gradient(145deg,rgba(169,184,162,.09),transparent 52%),
    #0e1614;
}

.market-location-panel__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: .85rem;
  border-bottom: 1px solid var(--rubber-line);
}

.market-location-panel__header > div > span {
  color: var(--rubber-muted);
  font-size: .56rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.market-location-panel__title {
  margin: .2rem 0 0;
  font-size: clamp(1.55rem,2.4vw,2.1rem);
  line-height: 1;
}

.market-location-panel__header .market-status-chip {
  max-width: 10rem;
  padding-top: .12rem;
  text-align: right;
}

.market-grade-list__labels,
.market-grade-row {
  display: grid;
  grid-template-columns: minmax(4.25rem,.55fr) minmax(10rem,1.35fr) minmax(6.5rem,.75fr);
  column-gap: .8rem;
  align-items: center;
}

.market-grade-list__labels {
  padding: .7rem .15rem .42rem;
  color: var(--rubber-muted);
  font-size: .52rem;
  font-weight: 800;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.market-grade-list__labels span:last-child {
  text-align: right;
}

.market-grade-list {
  border-top: 1px solid rgba(169,184,162,.09);
}

.market-grade-row {
  min-height: 4.35rem;
  padding: .65rem .15rem;
  border-bottom: 1px solid rgba(169,184,162,.11);
}

.market-grade-row__identity {
  min-width: 0;
}

.market-grade-row__grade {
  display: block;
  color: #f4f2e9;
  font-size: .78rem;
  letter-spacing: .015em;
  overflow-wrap: anywhere;
}

.market-grade-row__identity small {
  display: block;
  margin-top: .2rem;
  color: var(--rubber-muted);
  font-size: .6rem;
  line-height: 1.35;
}

.market-grade-row__value {
  min-width: 0;
}

.market-grade-row__price,
.market-grade-row__state {
  display: block;
  color: #f4f2e9;
  font-family: var(--font-display);
  font-size: clamp(1.75rem,2.45vw,2.35rem);
  font-weight: 400;
  letter-spacing: -.018em;
  line-height: .98;
  overflow-wrap: anywhere;
}

.market-grade-row__state {
  max-width: 12ch;
  color: #e0c28d;
  font-size: clamp(1.35rem,2vw,1.8rem);
  line-height: 1.02;
}

.market-grade-row__change {
  display: inline-flex;
  justify-content: flex-end;
  gap: .35rem;
  color: var(--rubber-muted);
  font-size: .68rem;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

.market-grade-row__change > span:first-child {
  color: var(--rubber-accent-bright);
}

.market-location-panel__footer {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 1rem;
  align-items: center;
  padding-top: .75rem;
}

.market-location-panel__meta {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: .9rem;
  margin: 0;
}

.market-location-panel__footer > a {
  color: var(--rubber-accent-bright);
  font-size: .67rem;
  font-weight: 700;
  white-space: nowrap;
}

.market-location-details {
  margin-top: .72rem;
  color: var(--rubber-muted);
  font-size: .7rem;
}

.market-location-details summary {
  width: max-content;
  cursor: pointer;
  color: var(--rubber-accent-bright);
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.market-location-details summary:focus-visible {
  outline: 2px solid var(--rubber-accent-bright);
  outline-offset: .25rem;
}

.market-location-details > div {
  margin-top: .68rem;
  padding: .75rem .8rem;
  border-left: 2px solid rgba(169,184,162,.34);
  background: rgba(255,255,255,.022);
}

.market-location-details p {
  margin: 0;
  line-height: 1.55;
}

.market-location-details p + p {
  margin-top: .4rem;
}

.market-location-details__unit {
  color: var(--rubber-accent-bright);
}

.market-history {
  padding-block: clamp(3rem,5vw,5rem);
}

.rubber-price-desk {
  position: relative;
  padding-block: clamp(3.5rem,6vw,5.75rem);
  border-top: 1px solid rgba(194,140,91,.25);
}

.rubber-price-desk::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: .2rem;
  background: linear-gradient(180deg,rgba(194,140,91,.15),rgba(194,140,91,.75),rgba(194,140,91,.15));
  content: '';
}

html[data-theme='light'] .market-board-summary,
html[data-theme='light'] .market-location-panel,
html[data-theme='light'] .market-location-panel--priority {
  border-color: rgba(52,76,61,.16);
  background:
    linear-gradient(145deg,rgba(56,91,69,.035),transparent 52%),
    #fffefa;
  color: var(--ink);
  box-shadow: 0 .8rem 2.2rem rgba(43,58,49,.06);
}

html[data-theme='light'] .market-board-summary__heading > p:last-child,
html[data-theme='light'] .market-reference-group__heading > span,
html[data-theme='light'] .market-location-panel__header > div > span,
html[data-theme='light'] .market-grade-list__labels,
html[data-theme='light'] .market-grade-row__identity small,
html[data-theme='light'] .market-grade-row__change,
html[data-theme='light'] .market-location-details,
html[data-theme='light'] .market-status-chip,
html[data-theme='light'] .market-board-summary__meta dt,
html[data-theme='light'] .market-location-panel__meta dt {
  color: var(--ink-muted);
}

html[data-theme='light'] .market-board-summary__meta dd,
html[data-theme='light'] .market-location-panel__meta dd,
html[data-theme='light'] .market-grade-row__grade,
html[data-theme='light'] .market-grade-row__price,
html[data-theme='light'] .market-location-details__unit,
html[data-theme='light'] .market-location-details summary,
html[data-theme='light'] .market-location-panel__footer > a {
  color: var(--ink);
}

html[data-theme='light'] .market-grade-row__state {
  color: #8a572d;
}

html[data-theme='light'] .market-status-chip::before {
  background: #557765;
  box-shadow: 0 0 0 .18rem rgba(85,119,101,.09);
}

html[data-theme='light'] .market-status-chip--delayed::before,
html[data-theme='light'] .market-status-chip--error::before,
html[data-theme='light'] .market-status-chip--unverified::before,
html[data-theme='light'] .market-status-chip--stale::before,
html[data-theme='light'] .market-status-chip--mixed::before {
  background: #a76f36;
}

html[data-theme='light'] .market-board-summary__meta a:hover,
html[data-theme='light'] .market-board-summary__meta a:focus-visible,
html[data-theme='light'] .market-location-panel__footer > a:hover,
html[data-theme='light'] .market-location-panel__footer > a:focus-visible {
  color: #284838;
}

html[data-theme='light'] .market-location-details > div {
  border-left-color: rgba(56,91,69,.35);
  background: rgba(56,91,69,.035);
}

html[data-theme='light'] .rubber-price-desk {
  border-top-color: rgba(145,91,50,.22);
}

@media (max-width: 70rem) {
  .market-board-summary {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .market-board-summary__heading h2 {
    max-width: none;
  }

  .market-grade-list__labels,
  .market-grade-row {
    grid-template-columns: minmax(4.25rem,.55fr) minmax(8rem,1.2fr) minmax(5.8rem,.75fr);
  }
}

@media (max-width: 64rem) {
  .market-location-panel {
    padding: 1.15rem;
  }

  .market-grade-list__labels {
    display: none;
  }

  .market-grade-list {
    margin-top: .35rem;
    border-top: 0;
  }

  .market-grade-row {
    grid-template-columns: minmax(4.5rem,.55fr) minmax(6rem,.45fr);
    grid-template-areas:
      'identity change'
      'value value';
    row-gap: .38rem;
    min-height: 5.25rem;
  }

  .market-grade-row__identity { grid-area: identity; }
  .market-grade-row__value { grid-area: value; }
  .market-grade-row__change { grid-area: change; }

  .market-grade-row__price,
  .market-grade-row__state {
    font-size: clamp(1.55rem,3vw,2.05rem);
  }
}

@media (max-width: 47rem) {
  .rubber-page-hero--market {
    padding-block: 4rem 2.5rem;
  }

  .rubber-market-state {
    padding-block: 2.5rem 3.5rem;
  }

  .market-board-summary__meta {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .market-controls {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .market-controls fieldset:first-child {
    grid-column: 1 / -1;
  }

  .market-controls .button {
    grid-column: 1 / -1;
  }

  .market-location-grid {
    grid-template-columns: 1fr;
  }

  .market-reference-group__heading {
    display: flex;
    align-items: end;
  }

  .market-location-panel__footer {
    grid-template-columns: minmax(0,1fr) auto;
  }
}

@media (max-width: 34rem) {
  .market-board-summary {
    padding: 1.1rem;
  }

  .market-board-summary__heading h2 {
    font-size: clamp(1.85rem,9vw,2.5rem);
  }

  .market-board-summary__meta {
    grid-template-columns: 1fr;
  }

  .market-board-summary__meta > div {
    padding: .68rem .72rem;
  }

  .market-controls {
    grid-template-columns: 1fr;
  }

  .market-controls fieldset:first-child,
  .market-controls .button {
    grid-column: auto;
  }

  .market-reference-group__heading {
    display: grid;
  }

  .market-location-panel__header {
    display: grid;
  }

  .market-location-panel__header .market-status-chip {
    max-width: none;
    text-align: left;
  }

  .market-grade-row {
    grid-template-columns: minmax(0,1fr) auto;
    padding-block: .75rem;
  }

  .market-grade-row__price,
  .market-grade-row__state {
    font-size: clamp(1.5rem,8vw,1.95rem);
  }

  .market-location-panel__footer {
    grid-template-columns: 1fr;
    gap: .7rem;
  }

  .market-location-panel__meta {
    gap: .65rem;
  }

  .market-location-panel__footer > a {
    width: max-content;
  }
}

@media (prefers-reduced-motion: reduce) {
  .market-location-details summary {
    scroll-behavior: auto;
  }
}