.regionPlanner { border: 1px solid var(--border, #485039); border-radius: 8px; margin: 0 0 14px; background: #171d16; color: #eee9dc; overflow-wrap: anywhere; }
.regionPlanner > summary { cursor: pointer; padding: 12px; font-weight: 700; min-height: 44px; }
.regionPlanner > summary small { display: block; margin-top: 5px; font-weight: 400; color: #d8cb96; line-height: 1.4; }
.regionPlannerBody { padding: 0 12px 12px; }
.regionPlannerBody p { margin: 10px 0; line-height: 1.45; }
.regionPlannerBody h4 { margin: 16px 0 6px; font-size: 1rem; }
.regionPlannerBody label { display: grid; gap: 6px; }
.regionPlannerBody select { width: 100%; min-width: 0; min-height: 44px; font-size: 1rem; }
.regionPlannerActions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.regionPlannerActions button { flex: 1 1 110px; min-width: 0; min-height: 44px; white-space: normal; }
.regionPlannerNote { color: #c1c7b5; font-size: .82rem; }
.regionObjective { border-left: 3px dashed #f5df8d; padding-left: 9px; }
.regionObjective.isComplete { border-left-style: solid; color: #bedf9d; }
.regionCountries { display: grid; gap: 6px; }
.regionCountries button { text-align: left; width: 100%; min-width: 0; min-height: 44px; white-space: normal; overflow-wrap: anywhere; border-left: 3px solid #899279; }
.regionCountries button[data-region-status="unexplored"] { border-left-style: dotted; }
.regionCountries button[aria-pressed="true"] { outline: 2px solid #f5df8d; outline-offset: -2px; }
.regionPlanner :is(button, select, summary):focus-visible { outline: 2px solid #f5df8d; outline-offset: 2px; }
.regionCountryFacts { margin-top: 12px; padding-top: 4px; border-top: 1px solid #485039; }
.regionPlanner [hidden], [data-region-planner-host][hidden] { display: none !important; }
.regionCountryFacts .countryFacts { max-width: 100%; }
#commandInfo .countryList { max-height: none; overflow: visible; }