#macro-view .macro-research-hero { padding: 38px 0 22px; }
#macro-view .macro-research-hero h1 { font-size: clamp(34px, 4vw, 54px); }
.macro-assessment-context { display: flex; align-items: baseline; gap: 12px; margin: 0 0 18px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 9px; background: #f1eee6; color: var(--muted); font-size: 11px; }
.macro-assessment-context span { text-transform: uppercase; letter-spacing: .08em; }
.macro-assessment-context strong { color: var(--ink); font-size: 13px; }
.macro-assessment-context p { margin: 0; }
.macro-workspace { display: grid; grid-template-columns: minmax(220px, 20%) minmax(0, 1fr); gap: 24px; align-items: start; margin-bottom: 48px; }
.macro-selector { position: sticky; top: 92px; max-height: calc(100vh - 112px); overflow: auto; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.macro-selector-head { display: grid; grid-template-columns: 1fr auto; align-items: center; margin-bottom: 12px; }
.macro-selector-head .eyebrow { margin: 0; }
.macro-selector-head h2 { grid-column: 1; margin: 3px 0 0; font: 400 24px Georgia, serif; }
.macro-selector-head button { grid-column: 2; grid-row: 1 / 3; padding: 4px 9px; font-size: 20px; background: transparent; }
.macro-nav-group { border-top: 1px solid var(--line); padding-top: 7px; }
.macro-nav-toggle { display: flex; width: 100%; justify-content: space-between; border: 0; padding: 8px 4px; background: transparent; font-weight: 700; text-align: left; }
.macro-nav-toggle b { font-weight: 400; }
.macro-nav-group.is-collapsed .macro-nav-toggle b { transform: rotate(-90deg); }
.macro-nav-group.is-collapsed .macro-nav-items { display: none; }
.macro-nav-items { display: grid; gap: 3px; }
.macro-nav-item { width: 100%; border: 0; border-left: 3px solid transparent; padding: 10px; background: transparent; text-align: left; }
.macro-nav-item:hover { background: #f1eee6; }
.macro-nav-item.is-selected { border-left-color: var(--orange); background: #f5eadc; font-weight: 700; }
.macro-research-panel { min-width: 0; }
.macro-loading,.macro-public-error { padding: 28px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); color: var(--muted); }
.macro-indicator-head { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 34px; padding: 28px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.macro-indicator-head h2 { margin: 7px 0 12px; font: 400 clamp(36px,5vw,58px)/1 Georgia,serif; letter-spacing: -.04em; }
.macro-indicator-head p { max-width: 720px; color: var(--muted); line-height: 1.6; }
.macro-context-line { color: #8b4d20 !important; }
.macro-current-reading { min-width: 190px; padding-left: 28px; border-left: 1px solid var(--line); text-align: right; }
.macro-current-reading span,.macro-current-reading small { display: block; color: var(--muted); font-size: 10px; }
.macro-current-reading strong { display: block; margin: 10px 0 8px; font: 400 clamp(34px,4vw,54px) Georgia,serif; }
.macro-chart-section { margin-top: 20px; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.macro-chart-head { display: flex; justify-content: space-between; gap: 18px; }
.macro-chart-head h3 { margin: 0; font: 400 25px Georgia,serif; }
.macro-chart-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.macro-chart-actions,.macro-date-controls { display: flex; flex-wrap: wrap; gap: 7px; align-items: end; }
.macro-chart-actions button,.macro-date-controls button { font-size: 10px; }
.macro-chart-actions button.is-active { background: var(--ink); color: white; }
.macro-date-controls { margin: 14px 0; }
.macro-date-controls label { display: grid; gap: 4px; color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.macro-chart-surface { position: relative; height: 520px; }
.macro-measurement { position: absolute; z-index: 3; top: 15px; left: 50%; transform: translateX(-50%); padding: 12px 16px; border: 1px solid #d8c49c; border-radius: 9px; background: rgba(255,253,248,.95); box-shadow: 0 10px 25px #27201418; font-size: 11px; pointer-events: none; }
.macro-reading-guide { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; margin-top: 20px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--line); }
.macro-reading-guide article { padding: 26px; background: var(--panel); }
.macro-reading-guide span { color: var(--orange); font-size: 10px; font-weight: 800; }
.macro-reading-guide h3 { margin: 8px 0; font: 400 20px Georgia,serif; }
.macro-reading-guide p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.macro-mobile-selector { display: none; }
.macro-workspace.is-selector-collapsed { grid-template-columns: 48px minmax(0,1fr); }
.macro-workspace.is-selector-collapsed .macro-selector { overflow: hidden; padding: 8px; }
.macro-workspace.is-selector-collapsed .macro-selector-head > :not(button),.macro-workspace.is-selector-collapsed #macro-navigation { display: none; }
.macro-workspace.is-selector-collapsed .macro-selector-head { display: block; margin: 0; }
.macro-workspace.is-selector-collapsed .macro-selector-head button { width: 100%; }
@media (max-width: 800px) {
  .macro-workspace,.macro-workspace.is-selector-collapsed { display: block; }
  .macro-mobile-selector { display: grid; grid-template-columns: 1fr auto; gap: 2px; width: 100%; margin-bottom: 12px; text-align: left; }
  .macro-mobile-selector span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
  .macro-mobile-selector strong { grid-column: 1; }.macro-mobile-selector b { grid-column: 2; grid-row: 1/3; align-self: center; }
  .macro-selector,.macro-workspace.is-selector-collapsed .macro-selector { display: none; position: static; max-height: 65vh; margin-bottom: 12px; padding: 16px; overflow: auto; }
  .macro-workspace.is-mobile-selector-open .macro-selector { display: block; }
  .macro-selector-head button { display: none; }
  .macro-workspace.is-selector-collapsed .macro-selector-head > :not(button),.macro-workspace.is-selector-collapsed #macro-navigation { display: initial; }
  .macro-indicator-head { grid-template-columns: 1fr; padding: 20px; }
  .macro-current-reading { padding: 16px 0 0; border: 0; border-top: 1px solid var(--line); text-align: left; }
  .macro-chart-head { display: block; }.macro-chart-actions { margin-top: 12px; }
  .macro-chart-surface { height: 380px; }.macro-reading-guide { grid-template-columns: 1fr; }
}
