.climate-grid {
  --serif: "Fraunces",Georgia,serif;
  --mono: "DM Mono","Courier New",monospace;
  --sans: "DM Sans",Arial,sans-serif;
  --phase-accent: var(--teal);
  font-family: var(--sans);
  color: #f2f5f2
}
body.light-mode .climate-grid {
  color: #16242d;
  --lm-gold: #9d7228
}
.climate-grid .workspace-card {
  position: relative;
  padding: 16px;
  border: 1px solid rgba(130,179,221,.296);
  background: linear-gradient(180deg,rgba(255,255,255,.018),transparent 24%),radial-gradient(circle at 12% 0,rgba(122,192,255,.055),transparent 34%),#07111d;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.024),0 10px 22px rgba(0,0,0,.043)
}
body.light-mode .climate-grid .workspace-card {
  border: 1px solid rgba(90,149,193,.313)!important;
  background: radial-gradient(circle at 10% 0,rgba(29,158,117,.055),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.98),rgba(244,242,236,.98))!important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96),0 12px 25px rgba(25,45,54,.043)!important
}
.climate-grid .workspace-kicker {
  margin-bottom: 12px;
  color: #93b8c8
}
body.light-mode .climate-grid .workspace-kicker {
  color: #8a6723!important;
  font-weight: 700;
  letter-spacing: .15em
}
.climate-activity-head {
  --serif: "Fraunces",Georgia,serif;
  --mono: "DM Mono","Courier New",monospace;
  --sans: "DM Sans",Arial,sans-serif
}
.climate-grid .outlook-list {
  display: grid;
  gap: 7px
}
.climate-grid .climate-option {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  padding: 11px 12px;
  border: 1px solid rgba(142,160,168,.14);
  background: #07111d
}
.climate-grid .climate-option.active {
  border-color: rgba(213,173,99,.5)
}
.climate-grid .climate-option strong {
  font: 500 9px var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase
}
.climate-grid .climate-option p {
  grid-column: 1/-1;
  margin: 0;
  font: 300 10.5px/1.45 var(--sans);
  color: #8f9da4
}
.climate-grid .outlook-tag {
  align-self: start;
  font: 500 7.5px var(--mono);
  letter-spacing: .08em;
  color: var(--gold);
  border: 1px solid rgba(213,173,99,.38);
  padding: 4px 6px
}
.climate-grid .outlook-list {
  gap: 8px
}
.climate-grid .climate-option {
  position: relative;
  overflow: hidden;
  padding: 12px 12px 12px 15px;
  border-color: rgba(142,160,168,.16);
  background: linear-gradient(180deg,rgba(11,23,35,.92),rgba(7,17,29,.98));
  transition: border-color .2s ease,background .2s ease,transform .2s ease
}
.climate-grid .climate-option::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #d5ad63;
  opacity: .55
}
.climate-grid .climate-option.active {
  border-color: rgba(122,192,255,.38);
  background: linear-gradient(180deg,rgba(122,192,255,.055),rgba(7,17,29,.98));
  box-shadow: inset 0 0 0 1px rgba(122,192,255,.06),0 9px 18px rgba(0,0,0,.08)
}
.climate-grid .climate-option strong {
  color: #e8efed;
  font-size: 9.5px;
  letter-spacing: .07em
}
.climate-grid .climate-option p {
  margin-top: 3px;
  color: #9dabb2;
  font-size: 10.7px;
  line-height: 1.48
}
.climate-grid .outlook-tag {
  min-width: 58px;
  text-align: center;
  padding: 5px 7px;
  border-radius: 4px;
  background: rgba(213,173,99,.045);
  color: #d5ad63;
  border-color: rgba(213,173,99,.34);
  font-size: 7px;
  letter-spacing: .1em
}
body.light-mode .climate-grid .climate-option {
  border: 1px solid rgba(34,73,82,.14)!important;
  background: linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,244,238,.98))!important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92),0 7px 16px rgba(30,50,58,.035)!important
}
body.light-mode .climate-grid .climate-option:hover {
  border-color: rgba(34,73,82,.25)!important;
  transform: translateY(-1px)
}
body.light-mode .climate-grid .climate-option.active {
  border-color: rgba(54,108,122,.34)!important;
  background: linear-gradient(180deg,rgba(232,244,246,.98),rgba(247,245,239,.98))!important;
  box-shadow: inset 3px 0 0 #5a9cb2,inset 0 1px 0 #fff,0 9px 18px rgba(30,50,58,.05)!important;
  outline-color: rgba(54,108,122,.24);
  animation-name: v297-climate-pulse-light
}
body.light-mode .climate-grid .climate-option strong {
  color: #102a33!important;
  font-weight: 700
}
body.light-mode .climate-grid .climate-option p {
  color: #536a72!important;
  font-weight: 400
}
body.light-mode .climate-grid .outlook-tag {
  color: #7e6327!important;
  background: rgba(201,168,76,.08)!important;
  border-color: rgba(145,107,30,.26)!important;
  font-weight: 700
}
body.light-mode .climate-grid .climate-option strong {
  color: #2b454d!important
}
.climate-grid .climate-option[data-help] {
  overflow: visible;
  z-index: 1;
  cursor: pointer;
  outline: 0
}
.climate-grid .climate-option[data-help]:focus-visible,
.climate-grid .climate-option[data-help]:hover {
  z-index: 30
}
.climate-grid .climate-option[data-help]::after {
  content: attr(data-help);
  position: absolute;
  left: 10px;
  right: 10px;
  top: calc(100% + 7px);
  z-index: 90;
  padding: 11px 12px;
  border: 1px solid rgba(122,192,255,.24);
  border-radius: 8px;
  background: rgba(5,14,24,.99);
  box-shadow: 0 16px 34px rgba(0,0,0,.36);
  font: 400 9.5px/1.48 var(--sans);
  letter-spacing: 0;
  text-transform: none;
  color: #c7d3d7;
  white-space: pre-line;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-3px);
  transition: opacity .14s ease,transform .14s ease,visibility .14s ease;
  pointer-events: none
}
.climate-grid .climate-option[data-help]:focus-visible::after,
.climate-grid .climate-option[data-help]:hover::after {
  opacity: 1;
  visibility: visible;
  transform: translateY(0)
}
.studio-section:has(.climate-grid .climate-option[data-help]:focus-visible),
.studio-section:has(.climate-grid .climate-option[data-help]:hover) {
  z-index: 5
}
body.light-mode .climate-grid .climate-option[data-help]::after {
  background: rgba(255,254,249,.995);
  border-color: rgba(47,91,104,.22);
  color: #35535b;
  box-shadow: 0 14px 30px rgba(35,57,64,.14),inset 0 1px 0 #fff
}
.climate-grid .datum-methodology {
  margin: 10px 0 12px;
  border: 1px solid rgba(122,192,255,.16);
  border-radius: 9px;
  background: linear-gradient(180deg,rgba(122,192,255,.035),rgba(255,255,255,.01));
  overflow: hidden
}
.climate-grid .datum-methodology-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 12px;
  border: 0;
  background: 0 0;
  color: #dfe8e9;
  text-align: left;
  cursor: pointer
}
.climate-grid .datum-methodology-toggle > span:first-child {
  min-width: 0
}
.climate-grid .datum-methodology-toggle strong {
  display: block;
  font: 500 8px var(--mono);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #dbe7e9
}
.climate-grid .datum-methodology-toggle small {
  display: block;
  margin-top: 3px;
  font: 400 8.5px/1.35 var(--sans);
  color: #81969f
}
.climate-grid .datum-methodology-screw {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(142,160,168,.2);
  background: rgba(255,255,255,.018);
  color: #8da0a8;
  font: 400 15px var(--sans);
  transition: transform .18s ease,color .18s ease,border-color .18s ease
}
.climate-grid .datum-methodology.open .datum-methodology-screw {
  transform: rotate(45deg);
  color: #7ac0ff;
  border-color: rgba(122,192,255,.42)
}
.climate-grid .datum-methodology-body {
  padding: 0 13px 14px;
  border-top: 1px solid rgba(122,192,255,.1)
}
.climate-grid .datum-methodology-body[hidden] {
  display: none!important
}
.climate-grid .datum-methodology-body p {
  margin: 12px 0 0;
  font: 400 9.4px/1.62 var(--sans);
  color: #a6b6bb
}
.climate-grid .datum-methodology-body h4 {
  margin: 15px 0 -5px;
  font: 500 8.2px/1.25 var(--mono);
  letter-spacing: .11em;
  text-transform: uppercase;
  color: #7ac0ff
}
body.light-mode .climate-grid .datum-methodology {
  border-color: rgba(47,91,104,.16);
  background: linear-gradient(180deg,rgba(93,202,165,.055),rgba(255,255,255,.56));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92)
}
body.light-mode .climate-grid .datum-methodology-toggle {
  color: #29454d
}
body.light-mode .climate-grid .datum-methodology-toggle strong {
  color: #29454d
}
body.light-mode .climate-grid .datum-methodology-toggle small {
  color: #667d84
}
body.light-mode .climate-grid .datum-methodology-screw {
  background: linear-gradient(180deg,#fff,#f4f2ec);
  border-color: rgba(47,91,104,.18);
  color: #61787f
}
body.light-mode .climate-grid .datum-methodology.open .datum-methodology-screw {
  color: #2d6c82;
  border-color: rgba(45,108,130,.3)
}
body.light-mode .climate-grid .datum-methodology-body {
  border-top-color: rgba(47,91,104,.11)
}
body.light-mode .climate-grid .datum-methodology-body p {
  color: #536b72
}
body.light-mode .climate-grid .datum-methodology-body h4 {
  color: #2f6f85
}
.climate-grid .climate-option[data-outlook-key=blend]::before {
  background: #1d9e75!important
}
.climate-grid .climate-option[data-outlook-key=parametric]::before {
  background: #4da8da!important
}
.climate-grid .climate-option[data-outlook-key=historical]::before {
  background: #c9a84c!important
}
.climate-grid .climate-option[data-outlook-key=cape]::before {
  background: #5dcaa5!important
}
.climate-grid .climate-option[data-outlook-key=regime]::before {
  background: #6b7bc4!important
}
.climate-grid .climate-option[data-outlook-key=blend] .outlook-tag {
  color: #79dec7!important;
  border-color: rgba(121,222,199,.34)!important;
  background: rgba(121,222,199,.055)!important
}
.climate-grid .climate-option[data-outlook-key=parametric] .outlook-tag {
  color: #72b9df!important;
  border-color: rgba(77,168,218,.34)!important;
  background: rgba(77,168,218,.055)!important
}
.climate-grid .climate-option[data-outlook-key=historical] .outlook-tag {
  color: #d5ad63!important;
  border-color: rgba(201,168,76,.34)!important;
  background: rgba(201,168,76,.055)!important
}
.climate-grid .climate-option[data-outlook-key=cape] .outlook-tag {
  color: #79dec7!important;
  border-color: rgba(93,202,165,.34)!important;
  background: rgba(93,202,165,.055)!important
}
.climate-grid .climate-option[data-outlook-key=regime] .outlook-tag {
  color: #a69ee8!important;
  border-color: rgba(107,123,196,.38)!important;
  background: rgba(107,123,196,.06)!important
}
body.light-mode .climate-grid .climate-option[data-outlook-key=blend] .outlook-tag {
  color: #17624f!important
}
body.light-mode .climate-grid .climate-option[data-outlook-key=parametric] .outlook-tag {
  color: #2f6d85!important
}
body.light-mode .climate-grid .climate-option[data-outlook-key=historical] .outlook-tag {
  color: #80631f!important
}
body.light-mode .climate-grid .climate-option[data-outlook-key=cape] .outlook-tag {
  color: #15785f!important
}
body.light-mode .climate-grid .climate-option[data-outlook-key=regime] .outlook-tag {
  color: #4f5e9d!important
}
.climate-grid .phase-workspace-intro {
  margin: 7px 0 13px;
  max-width: 60ch;
  font: 400 11.2px/1.62 var(--sans);
  color: #aebbc0
}
body.light-mode .climate-grid .phase-workspace-intro {
  color: #4f6870!important
}
.market-climate-intro {
  max-width: 60ch;
  margin-bottom: 13px
}
@keyframes v297-climate-pulse-dark {
  0%,
  100% {
    outline-color: rgba(122,192,255,.2);
    filter: drop-shadow(0 0 0 rgba(122,192,255,0))
  }
  50% {
    outline-color: rgba(122,192,255,.68);
    filter: drop-shadow(0 0 8px rgba(122,192,255,.18))
  }
}
@keyframes v297-climate-pulse-light {
  0%,
  100% {
    outline-color: rgba(54,108,122,.2);
    filter: drop-shadow(0 2px 0 rgba(54,108,122,0))
  }
  50% {
    outline-color: rgba(54,108,122,.58);
    filter: drop-shadow(0 5px 7px rgba(54,108,122,.12))
  }
}
.climate-grid .climate-option.active {
  outline: 1px solid rgba(122,192,255,.28);
  outline-offset: 1px;
  animation: v297-climate-pulse-dark 2.85s ease-in-out infinite;
  will-change: filter,outline-color
}
@media (prefers-reduced-motion:reduce) {
  .climate-grid .climate-option.active {
    animation: none!important;
    filter: none!important;
    outline: 1px solid rgba(122,192,255,.55)!important
  }
  body.light-mode .climate-grid .climate-option.active {
    outline: 1px solid rgba(54,108,122,.55)!important
  }
}