/* Period-specific reading layouts. All article text and facts arrive in server-rendered HTML. */
.draw-commentary-preview, .draw-commentary { min-width:0; }
.draw-commentary-preview { display:flex; align-items:center; gap:28px; border-top:3px solid #176c65; }
.commentary-preview-copy { min-width:0; flex:1; }
.commentary-eyebrow { margin:0 0 10px; color:#176c65; font-size:12px; font-weight:600; letter-spacing:.04em; }
.draw-commentary-preview h2 { margin:0 0 12px; font-size:19px; line-height:1.6; overflow-wrap:anywhere; }
.draw-commentary-preview h2 a { color:var(--ink, #17333d); }
.draw-commentary-preview h2 a:hover { color:#176c65; }
.commentary-preview-lead { max-width:80ch; margin:0; font-size:13px; line-height:1.9; color:#405965; }
.commentary-preview-window { margin:12px 0 0; font-size:11px; color:var(--dim, #637784); line-height:1.8; }
.results-page .commentary-read-link { min-height:44px; flex:none; gap:12px; padding:11px 16px; color:#176c65; background:#eef5f1; border-color:#d2e3db; white-space:nowrap; }
.results-page .commentary-read-link:hover { background:#e4f0e9; border-color:#b3d0c2; }
.results-page .result-period { vertical-align:top; }
.results-page .result-period .result-commentary-link { display:flex; align-items:center; width:max-content; max-width:100%; min-height:36px; font-family:var(--sans); font-size:11px; font-weight:400; color:#176c65; }
.draw-commentary { padding:30px; scroll-margin-top:150px; }
.draw-commentary-header { max-width:82ch; }
.draw-commentary-header h2 { margin:0 0 16px; color:var(--ink, #17333d); font-size:25px; line-height:1.55; overflow-wrap:anywhere; }
.commentary-lead { margin:0 0 22px; color:#405965; font-size:15px; line-height:1.95; }
.commentary-window { display:flex; gap:16px; padding:16px 18px; border:1px solid #e1e8e2; border-radius:10px; background:#f4f7f3; }
.commentary-window-label { flex:none; color:#176c65; font-size:12px; font-weight:600; line-height:1.9; }
.commentary-window > div { min-width:0; }
.commentary-window p { margin:0; color:#405965; font-size:12px; line-height:1.9; overflow-wrap:anywhere; }
.commentary-window .commentary-window-dates { margin-top:3px; color:#596f77; font-size:11px; font-variant-numeric:tabular-nums; }
.commentary-window .commentary-window-note { margin-top:5px; color:#637784; font-size:11px; }
.commentary-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:20px 0 8px; }
.commentary-facts > div { min-width:0; padding:14px 16px; border:1px solid var(--border-soft, #e2e8e5); border-radius:10px; }
.commentary-facts dt { color:#637784; font-size:11px; line-height:1.7; }
.commentary-facts dd { margin:7px 0 0; color:#173d41; font:600 20px/1.5 var(--mono, monospace); overflow-wrap:anywhere; }
.commentary-facts > div:last-child dd { font-family:var(--sans); font-size:14px; line-height:1.8; font-weight:500; }
.commentary-layout { display:grid; grid-template-columns:minmax(0,1fr) 210px; align-items:start; gap:40px; margin-top:28px; }
.commentary-body { min-width:0; max-width:78ch; }
.commentary-section { margin:0 0 30px; scroll-margin-top:150px; }
.commentary-section h3 { margin:0 0 13px; color:#173d41; font-size:18px; line-height:1.7; }
.commentary-section p { margin:0 0 13px; color:#344d58; font-size:15px; line-height:1.95; overflow-wrap:anywhere; text-wrap:pretty; }
.commentary-section p:last-child { margin-bottom:0; }
.commentary-disclaimer { margin:24px 0 0; padding-top:18px; border-top:1px solid var(--border-soft, #e2e8e5); color:#637784; font-size:12px; line-height:1.9; }
.commentary-outline { position:sticky; top:144px; min-width:0; padding:16px; border:1px solid var(--border-soft, #e2e8e5); border-radius:10px; background:#fafbf9; }
.commentary-outline > p { margin:0 0 8px; color:#637784; font-size:11px; font-weight:600; }
.commentary-outline ol { margin:0; padding:0; list-style:none; }
.commentary-outline li { margin:0; }
.commentary-outline a { display:flex; align-items:center; min-height:44px; padding:8px 0; color:#176c65; font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
.commentary-outline a:hover { color:#103b3a; text-decoration:underline; text-underline-offset:4px; }
.draw-commentary a:focus-visible, .draw-commentary-preview a:focus-visible, .result-commentary-link:focus-visible { outline:3px solid #87b8ac; outline-offset:4px; border-radius:3px; }
@media (max-width:1000px) {
  .commentary-layout { grid-template-columns:minmax(0,1fr) 180px; gap:24px; }
  .draw-commentary { padding:24px; }
  .commentary-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:768px) {
  .draw-commentary, .commentary-section { scroll-margin-top:24px; }
  .commentary-outline { top:24px; }
}
@media (max-width:700px) {
  .draw-commentary-preview { display:block; padding:18px; }
  .draw-commentary-preview h2 { font-size:18px; }
  .commentary-preview-lead { font-size:14px; }
  .results-page .commentary-read-link { margin-top:18px; justify-content:center; }
  .results-page .results-table .result-period { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
  .results-page .result-period .result-commentary-link { min-height:44px; font-size:12px; }
  .draw-commentary { padding:18px 16px; }
  .draw-commentary-header h2 { font-size:21px; }
  .commentary-lead { font-size:15px; line-height:1.9; }
  .commentary-window { display:block; padding:12px 14px; }
  .commentary-window-label { display:block; margin-bottom:4px; }
  .commentary-facts { gap:9px; margin-top:16px; }
  .commentary-facts > div { padding:12px; }
  .commentary-facts dd { font-size:19px; }
  .commentary-layout { display:flex; flex-direction:column; gap:22px; margin-top:22px; }
  .commentary-outline { position:static; order:-1; width:100%; box-sizing:border-box; padding:12px; }
  .commentary-outline ol { display:flex; gap:6px; max-width:100%; overflow-x:auto; overscroll-behavior-inline:contain; scrollbar-width:thin; }
  .commentary-outline li { flex:0 0 auto; }
  .commentary-outline a { min-height:44px; padding:8px 10px; white-space:nowrap; background:#eef4ee; border-radius:7px; box-sizing:border-box; }
  .commentary-section { margin-bottom:26px; }
  .commentary-section h3 { font-size:18px; }
  .commentary-section p { font-size:15px; line-height:2; }
}
@media (max-width:360px) {
  .draw-commentary { padding:16px 13px; }
  .draw-commentary-preview { padding:16px 14px; }
  .draw-commentary-header h2 { font-size:20px; }
  .commentary-facts dd { font-size:17px; }
}
