.regional-context { margin: 24px 0; color: #414d39; text-align: left; }
.region-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.regional-context h3 { margin: 0; font-size: 16px; line-height: 1.6; }
.region-era { font-size: 11px; color: #7b694e; }
.region-intro, .region-credit { margin: 8px 0 12px; font-size: 12px; line-height: 1.8; color: #747469; }
.region-cards { display: grid; gap: 8px; margin-top: 16px; }
.region-card { border: 1px solid #e0ddcf; border-radius: 14px; background: #fffdf7; overflow: hidden; transition: border-color var(--motion-fast), background var(--motion-fast); }
.region-card[open] { border-color: #b6c2a8; background: #fffef9; }
.region-card > summary { display: flex; align-items: center; gap: 8px; padding: 15px 14px; cursor: pointer; min-height: 64px; list-style: none; }
.region-card > summary::-webkit-details-marker { display: none; }
.region-card > summary::after { content: ''; flex: 0 0 7px; width: 7px; height: 7px; border-right: 1.5px solid #7b846f; border-bottom: 1.5px solid #7b846f; transform: rotate(45deg); transition: transform var(--motion-medium) var(--ease-out); margin: 0 2px 4px 4px; }
.region-card > summary[aria-expanded="true"]::after, .region-card[open] > summary:not([aria-expanded])::after { transform: rotate(225deg); margin-bottom: 0; }
.region-summary-text { flex: 1; min-width: 0; }
.region-card strong { display: block; font-size: 14px; line-height: 1.6; }
.region-card small { display: block; font-size: 11px; font-weight: 400; color: #79796b; line-height: 1.65; margin-top: 3px; word-break: keep-all; overflow-wrap: anywhere; }
.region-badge { flex-shrink: 0; padding: 3px 6px; border-radius: 6px; background: #f1eddf; color: #77654c; font-size: 10px; font-weight: 500; white-space: nowrap; }
.region-badge.is-direct { background: #e8eddf; color: #465935; }
.region-card-body { border-top: 1px solid #edece2; padding: 12px 14px 6px; font-size: 13px; line-height: 1.85; word-break: keep-all; overflow-wrap: anywhere; }
.region-card-body > p { margin: 0 0 10px; }
.region-evidence > summary, .region-credit > summary { padding: 10px 0; min-height: 44px; font-size: 11px; font-weight: 500; cursor: pointer; color: #68795a; }
.region-card blockquote { margin: 2px 0 12px; padding: 10px 12px; border-left: 2px solid #a4b58d; background: #f5f6ef; border-radius: 0 6px 6px 0; }
.region-card blockquote p { margin-top: 5px; }
.region-card cite { font-style: normal; font-size: 11px; color: #627149; }
.region-source { display: flex; flex-wrap: wrap; column-gap: 14px; font-size: 11px; }
.region-source a { display: inline-flex; align-items: center; min-height: 44px; }
.region-outside { font-size: 11px; color: #77776d; }
.region-credit { margin-top: 12px; }
.region-credit p { margin: 0 0 10px; }
.regional-context a { color: #51653e; text-underline-offset: 3px; }
.regional-context :focus-visible { outline: 2px solid #647b4e; outline-offset: -3px; }
@media (max-width: 360px) {
    .region-card > summary { padding: 12px 10px; gap: 6px; }
    .region-badge { font-size: 9px; padding-inline: 5px; }
}
